Récuperer la valeur d'une option de select

Résolu
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014
- 10 mai 2014 à 01:23
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014
- 13 mai 2014 à 22:27
Bonjour,
je veux récuperer la valeur choisis du select pour aditer des champs voila mon code:
<select name="nb" size="1" oninput="remplir();" id='select'  style="position:absolute;left:293px;top:95px;width:168px;height:22px;z-index:26;">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>


function remplir()
{   
    var nb = document.getElementById('select').value ;
	var valeur = nb.options[select.selectedIndex].value;

    var i;
    
    for (i=2;i<12;i++)
	{
    document.getElementById(i).disabled =true;
    }

    for(i=1; i<=(valeur*2)+1;i++)
    {
         document.getElementById(i).disabled =false;
    }
    
    nb = document.getElementById('select').value ;

}


pouvez-vous m'aider svp?merci d'avance

10 réponses

jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
356
10 mai 2014 à 02:01
onjour.
Je ne comprends pas ce que tu cherches à faire. ..
Surtout a quoi correspond le i dans ta ligne
document.getElementById(i)

Tu n'as aucun élément dont l'Id serait un chiffre...
Ou alors il nous manque du code...
0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

12 mai 2014 à 10:05
Bonjour je suis désolé pour le retard
oui il vous manque du code.j'ai 10 input qui deviennent éditable que lorsque j'entre un nb de 1 à 5.
merci
0
@karamel
Messages postés
1807
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
5 mai 2022
144
10 mai 2014 à 11:28
et aussi nb sans value

var nb = document.getElementById('select'); 

0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

12 mai 2014 à 10:08
voila le reste du code:
<span style="color:#000000;font-family:Arial;font-size:13px;">Module :</span></div>
<input type="text" id="Editbox1" style="position:absolute;left:77px;top:21px;width:166px;height:18px;line-height:18px;z-index:1;" name="modu" value="">
<div id="wb_Text2" style="position:absolute;left:291px;top:21px;width:45px;height:16px;z-index:2;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Seuil :</span></div>
<input type="text" id="Editbox2" style="position:absolute;left:339px;top:21px;width:166px;height:18px;line-height:18px;z-index:3;" name="Seuil" value="">
<div  style="position:absolute;left:150px;top:62px;width:45px;height:16px;z-index:2;">
<span style="color:#000000;font-family:Arial;font-size:13px;left:220px;">Departement:</span></div>
<input type="text"  style="position:absolute;left:240px;top:62px;width:166px;height:18px;line-height:18px;z-index:3;" name="br" value="">
<div id="wb_Text3" style="position:absolute;left:127px;top:109px;width:162px;height:16px;z-index:4;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Nombre de sous-modules :</span></div>
<hr id="Line1" style="margin:0;padding:0;position:absolute;left:126px;top:98px;width:332px;height:1px;z-index:5;">
<input type="text"  disabled="true" style="position:absolute;left:400px;top:241px;width:166px;height:18px;line-height:18px;z-index:6;" name="S4" id='9' value="">
<div id="wb_Text11" style="position:absolute;left:346px;top:244px;width:50px;height:16px;z-index:7;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Seuil :</span></div>
<input type="text"  disabled="true" style="position:absolute;left:400px;top:272px;width:166px;height:18px;line-height:18px;z-index:8;" name="S5" id='11' value="">
<div id="wb_Text15" style="position:absolute;left:346px;top:275px;width:50px;height:16px;z-index:9;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Seuil :</span></div>
<div id="wb_Text10" style="position:absolute;left:346px;top:213px;width:50px;height:16px;z-index:10;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Seuil :</span></div>
<input type="text"  disabled="true" style="position:absolute;left:400px;top:210px;width:166px;height:18px;line-height:18px;z-index:11;" name="S3" id='7' value="">
<div id="wb_Text7" style="position:absolute;left:346px;top:181px;width:50px;height:16px;z-index:12;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Seuil :</span></div>
<input type="text" disabled="true"  style="position:absolute;left:400px;top:178px;width:166px;height:18px;line-height:18px;z-index:13;" name="S2" id='5' value="">
<div id="wb_Text6" style="position:absolute;left:346px;top:148px;width:50px;height:16px;z-index:14;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Seuil :</span></div>
<input type="text" disabled="true"  style="position:absolute;left:400px;top:145px;width:166px;height:18px;line-height:18px;z-index:15;" name="S1" id='3' value="">
<input type="text"  style="position:absolute;left:147px;top:145px;width:166px;height:18px;line-height:18px;z-index:16;" name="Smod1" id='2' disabled="true" value="">
<input type="text"  style="position:absolute;left:147px;top:179px;width:166px;height:18px;line-height:18px;z-index:17;" name="Smod2" id='4' disabled="true" value="">
<input type="text" disabled="true"  style="position:absolute;left:147px;top:210px;width:166px;height:18px;line-height:18px;z-index:18;" name="Smod3" id='6' value="">
<input type="text" disabled="true"  style="position:absolute;left:147px;top:242px;width:166px;height:18px;line-height:18px;z-index:19;" name="Smod4" id='8' value="">
<input type="text"  disabled="true"  style="position:absolute;left:147px;top:273px;width:166px;height:18px;line-height:18px;z-index:20;" name="Smod5" id='10' value="">
<div id="wb_Text4" style="position:absolute;left:40px;top:148px;width:103px;height:16px;z-index:21;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Sous-module 1 :</span></div>
<div id="wb_Text5" style="position:absolute;left:40px;top:182px;width:103px;height:16px;z-index:22;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Sous-module 2 :</span></div>
<div id="wb_Text8" style="position:absolute;left:40px;top:213px;width:103px;height:16px;z-index:23;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Sous-module 3 :</span></div>
<div id="wb_Text9" style="position:absolute;left:40px;top:245px;width:103px;height:16px;z-index:24;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Sous-module 4 :</span></div>
<div id="wb_Text13" style="position:absolute;left:40px;top:276px;width:103px;height:16px;z-index:25;">
<span style="color:#000000;font-family:Arial;font-size:13px;">Sous-module 5 :</span></div>
<input name="nb" size="1" oninput="remplir();" id='1'  type='text' style= "position:absolute;left:293px;top:109px;width:168px;height:22px;z-index:26;">
0
@karamel
Messages postés
1807
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
5 mai 2022
144
12 mai 2014 à 11:31
il reste des zone d'ombres qui doit etre dissable ? pour les elements qui doivent il faudrait les renomer dans le genre elem3 elem4 elem5...etc et boucler de cette facon


 for (i=2;i<12;i++)
	{
    document.getElementById('elem'+i).disabled =true;
    }


et aussi pour plus de lisibilité dans le html et pour eviter les répétitions pour les style crée une feuille de style et utilise des class
0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

12 mai 2014 à 11:45
désolé mais j'ai pas bien compris cette phrase "il reste des zone d'ombres qui doit etre dissable ?" tous les zones sont disable dans cette page car j'ai mis disabled=true dans chaque zone
merci
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
@karamel
Messages postés
1807
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
5 mai 2022
144
Modifié par kazma le 12/05/2014 à 11:51

for (i=2;i<12;i++)
{
document.getElementById(i).disabled =true;
}


document.getElementById(i) doit correspondre a un element au vue du code je pense aux input et ecrit de la sorte cela voudrait dire que les elements se nomes 3 4 5 ...etc

cours Forest cours !
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
356
12 mai 2014 à 11:56
Il y a un autre point qui me "choque".
Pour le SELECT ... il te faut utiliser onchange et non oninput.
0
@karamel
Messages postés
1807
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
5 mai 2022
144
12 mai 2014 à 13:06
ca m'a choqué aussi et j'ai fait une recherche sur google pour etre sur et surpriseil existe vraiment mais je pense qu'il est rarement utilisé car il fonctionnement pas avec ie 8 et <
0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

12 mai 2014 à 13:28
nnn avant d'ajouter le select et les options tous ca marche avec oninput et jusqu'au mnt il ca marche.j'ai changer oninput avec onchange mais tjrs pas de changement
0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

12 mai 2014 à 13:33
juste je veux la changer pour limiter les choix et pour ne pas se charger de faire des tests pour interdire l'utilisateur à inserer un nb sup à 5
0
@karamel
Messages postés
1807
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
5 mai 2022
144
12 mai 2014 à 13:42
mais c'est qu'elles elements que tu veut changer sa ne se fera pas par magie
0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

12 mai 2014 à 14:02
je veux que les zones de sous module et seuil deviennent editables selon le nb que je saisie
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
356
12 mai 2014 à 14:05
Mounana.. regarde l'exemple que je viens de te donner.
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
356
12 mai 2014 à 13:58
Voici un petit exemple:

<select id="choixinput" onchange="initSaisie(this.value);" >
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>
<br><br>
   <br><input name="inputSaisie[]" type="text" id="1" disabled >
   <br><input name="inputSaisie[]" type="text" id="2" disabled >
   <br><input name="inputSaisie[]" type="text" id="3" disabled >
   <br><input name="inputSaisie[]" type="text" id="4" disabled >
   <br><input name="inputSaisie[]" type="text" id="5" disabled >
       
 <script type="text/javascript">
  function initSaisie(elemValue){
    var allInp = document.getElementsByName("inputSaisie[]");
     //alert (allInp.length);
    for(i=0;i < allInp.length;i++){
        allInp[i].disabled=true;
     }
     document.getElementById(elemValue).disabled=false;
    
}
       </script>

0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

12 mai 2014 à 14:09
cet exemple ne marche pas :( :(
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
356
12 mai 2014 à 14:12
Comment ça il ne marche pas ... ???

Tu l'as copié tel quel ? et ça ne fonctionne pas ???
Tu peux le tester ici : http://jsfiddle.net/jordane45/PxL5B/

Tu verras qu'il fonctionne très bien...

A toi par la suite de l'adapter à tes besoins...
0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

12 mai 2014 à 17:22
ahhh bon donc vous n'avez pas compris ce que je veux mais c'est pas grave je vais le modifier à mes besoins.
mercii bcp
0
jordane45
Messages postés
35473
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 mai 2022
356
12 mai 2014 à 17:35
ahhh bon donc vous n'avez pas compris ce que je veux

Ben... faut croire.... surement que les explications n'étaient pas très clair...

Enfin bon.. l'essentiel.. c'est qu'au final vous arriviez à faire ce que vous souhaitez.....
0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

12 mai 2014 à 17:37
ouiii merciiiii bcppppp
0
je pense qu'elle veut mettre x champs editables selon le nombre saisie dans le champs 'Nombre de sous-modules', par ex. si on saisie 3 alors les 3 premiers champs deviennent editables, mais avec la fonction que vous avez écris si on entre 3 alors seulement le 3éme champs devient editable, enfin je pense!
je viens pour aider puisqu'elle n'a pas encore marquer le Résolu.
Voila le code que je propose http://jsfiddle.net/s4eka/1/ !
0
@karamel
Messages postés
1807
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
5 mai 2022
144
Modifié par kazma le 13/05/2014 à 11:13
il faut d'abord recuperer la valeur du select et la transformé en valeur numérique avec parseInt en suite on ajoute une condition

<select id="choixinput" onchange="initSaisie(this.value);" >
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
</select>
<br><br>
   <br><input name="inputSaisie[]" type="text" id="1" disabled >
   <br><input name="inputSaisie[]" type="text" id="2" disabled >
   <br><input name="inputSaisie[]" type="text" id="3" disabled >
   <br><input name="inputSaisie[]" type="text" id="4" disabled >
   <br><input name="inputSaisie[]" type="text" id="5" disabled >
       
 <script type="text/javascript">

   function initSaisie(elemValue){

 var valeur = parseInt(elemValue);

 var allInp = document.getElementsByName("inputSaisie[]");

 for(var i=0;i < allInp.length;i++){

  if(i<valeur){
   
   allInp[i].disabled=false
  }
  
  else{
   allInp[i].disabled=true;
  }
 }
}
</script> 


cours Forest cours !
0
EL.marwaa123
Messages postés
99
Date d'inscription
jeudi 24 avril 2014
Statut
Membre
Dernière intervention
7 juin 2014

13 mai 2014 à 22:27
merci kazma et merci à tous mon prob est resolu merci ouma pour ce code c'est ce que je cherche merciii :) :)
0