Récupérer la valeur sélectionnée dans un <select>

Version imprimable

Salut à tous,

Je ne parviens pas à récupérer la valeur sélectionnée dans mon <select id='ref' ... >.

Lorsque je tente "alert(ref.selectedIndex);", il ne se passe plus rien sur mon évènement. Et lorsque j'en lève cette ligne, j'ai de nouveau mes traces.

Est-ce mon instruction est mauvaise ou est-ce qu'il y a un autre problème?

Je fais pourtant comme j'ai pu trouver à plusieurs endroits sur le web...

Merci d'avance.

Voici ma fonction :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
function resetFromTo(c, dates) {
 alert('onChange detecté');
 
 var ref = document.getElementById('ref');
 var from = document.getElementById('from');
 var to = document.getElementById('to');
 
 alert('onChange detecté');
 
 alert(ref.selectedIndex);
 //alert(ref.options[ref.selectedIndex].value);
 //alert(ref.options[ref.selectedIndex].text);
 from.selectedIndex = 0;
 to.selectedIndex = 0;
 
 /*for (i=0; i<dates.length; i++) {
  if (c[i]==ref.selectedIndex.value) {
   from.options.value = dates[i];
   from.options.text = dates[i];
  }
 }*/
 
 //from.disabled = true;
 //to.disabled = true;
}

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<script language='javascript'>
  var camp = new Array();
  var dates = new Array();
  camp[0] = 'ALM';dates[0] = '2008-12-31';
  camp[1] = 'ALM';dates[1] = '2009-01-31';
  camp[2] = 'ALM';dates[2] = '2009-02-28';
  camp[3] = 'ALM';dates[3] = '2009-03-31';
  camp[4] = 'ALM';dates[4] = '2009-04-30';
  camp[5] = 'ALM';dates[5] = '2009-05-31';
  camp[6] = 'ARPSON';dates[6] = '2009-05-16';
  camp[7] = 'ARPSON';dates[7] = '2009-05-23';
  camp[8] = 'ARPSON';dates[8] = '2009-05-30';
  camp[9] = 'ARPSON';dates[9] = '2009-06-06';
  camp[10] = 'ARPSON';dates[10] = '2009-06-13';
  camp[11] = 'ARPSON';dates[11] = '2009-06-20';
  camp[12] = 'CECAG';dates[12] = '2008-12-31';
  camp[13] = 'CECAGPR';dates[13] = '2008-12-31';
  camp[14] = 'RATIO';dates[14] = '2008-12-31';
  camp[15] = 'RATIO';dates[15] = '2009-01-31';
  camp[16] = 'RATIO';dates[16] = '2009-02-28';
  camp[17] = 'RATIO';dates[17] = '2009-03-31';
  camp[18] = 'RATIO';dates[18] = '2009-04-30';
  camp[19] = 'RATIO';dates[19] = '2009-05-31';
  camp[20] = 'SCL';dates[20] = '2008-12-31';
  camp[21] = 'SCL';dates[21] = '2009-01-31';
  camp[22] = 'SCL';dates[22] = '2009-02-28';
  camp[23] = 'SCL';dates[23] = '2009-03-31';
  camp[24] = 'SCL';dates[24] = '2009-04-30';
  camp[25] = 'SCL';dates[25] = '2009-05-31';
  camp[26] = 'TEST';dates[26] = '2008-12-31'; 
 </script>
 
 <select id="ref" name="camp" onchange="resetFromTo(camp, dates); return false;">
  <option value="">Choisir une campagne</option>
  <option selected='selected' value='ALM'>ALM</option>
  <option value='ARPSON'>ARPSON</option>
  <option value='CECAG'>CECAG - Indicateurs Mensuels</option>
  <option value='CECAGPR'>CECAG - Paramétrage</option>
  <option value='RATIO'>McDonough Ratio</option>
  <option value='SCL'>Synthese Client</option>  
 </select>

Bonjour,

Code:

1
2
<select onchange="alert(this.value);">
...

A+

Lorsque j'essaie avec <select id='from' ... > ça fonctionne.

Code:

alert(form.selectedIndex);

Code:

1
2
3
4
5
6
7
8
9
10
 
<select id="from" name="from" >
   <option></option>
   <option value="2008-12-31">31/12/2008</option>
   <option value="2009-01-31">31/01/2009</option>
   <option value="2009-02-28">28/02/2009</option>
   <option value="2009-03-31">31/03/2009</option>
   <option value="2009-04-30">30/04/2009</option>
   <option value="2009-05-31">31/05/2009</option>
  </select>

25/06/2009, 14h59
E.Bzz
Citation:
Envoyé par Goupo

Code:

alert(form.selectedIndex);

Code:

1 2 <select id="from" name="from" >
Mouais ... :aie:
25/06/2009, 15h11
Goupo
Oui, ben dans mon code j'ai écrit : "from".

J'ai fait une faute de frappe en l'écrivant à la main ici.

La trace dans le onChange fonctionne :
Code:

1 2 <select id="ref" name="camp" onchange="alert('trace'); resetFromTo(camp, dates);">
25/06/2009, 15h13
E.Bzz
Citation:
Envoyé par E.Bzz

Bonjour,

Code:

1 2 <select onchange="alert(this.value);"> ...

A+
25/06/2009, 15h17
devyan

Salut,

Tu ne fournis que le HTML de "ref", le problème vient peut-être du HTML de "from" ou de "to"
25/06/2009, 15h18
Goupo
Code:

1 2 <select id="ref" name="camp" onchange="alert(this.value); resetFromTo(campagnes, dates);">
Ca renvoie bien la valeur qui convient.

J'arrive vraiment pas à comprendre ce qui cloche... :(

Ah! ... Ca marche. Mais pas à tous les coups... 8O

Edit :

Finalement, ça à l'air de bien marcher mais je ne comprends pas pourquoi ça à foiré. J'ai toujours le même code que j'ai tenté de puis le début.
(Bon, il y a bien truc qui a du changer entre temps pour que ça fonctionne... Je suis pas encore complètement dingue. J'espère.)
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 function resetFromTo(c, dates) { alert('onChange detecté'); var ref = document.getElementById('ref'); var from = document.getElementById('from'); var to = document.getElementById('to'); alert(ref.selectedIndex); alert(ref.options[ref.selectedIndex].value); //alert(ref.options[ref.selectedIndex].value); //alert(ref.options[ref.selectedIndex].text); from.selectedIndex = 0; to.selectedIndex = 0; /*for (i=0; i<dates.length; i++) { if (c[i]==ref.selectedIndex.value) { from.options.value = dates[i]; from.options.text = dates[i]; } }*/ //from.disabled = true; //to.disabled = true; }

Alors, celle là elle est bonne. Maintenant que mon code marche, j'ai décidé de retirer mes traces.

Par prudence, je les retire une par une.

Ca, ça fonctionne parfaitement :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 
function resetFromTo(c, dates) {
 var ref = document.getElementById('ref');
 var from = document.getElementById('from');
 var to = document.getElementById('to');
 
 alert(ref.selectedIndex);
 
 alert(ref.options[ref.selectedIndex].value);
 
 //alert(ref.options[ref.selectedIndex].value);
 //alert(ref.options[ref.selectedIndex].text);
 from.selectedIndex = 0;
 to.selectedIndex = 0;
 
 /*for (i=0; i<dates.length; i++) {
  if (c[i]==ref.selectedIndex.value) {
   from.options.value = dates[i];
   from.options.text = dates[i];
  }
 }*/
 
 //from.disabled = true;
 //to.disabled = true;
}

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
Ca, ça fonctionne aussi:
function resetFromTo(c, dates) {
 var ref = document.getElementById('ref');
 var from = document.getElementById('from');
 var to = document.getElementById('to');
 
 
 
 alert(ref.options[ref.selectedIndex].value);
 
 //alert(ref.options[ref.selectedIndex].value);
 //alert(ref.options[ref.selectedIndex].text);
 from.selectedIndex = 0;
 to.selectedIndex = 0;
 
 /*for (i=0; i<dates.length; i++) {
  if (c[i]==ref.selectedIndex.value) {
   from.options.value = dates[i];
   from.options.text = dates[i];
  }
 }*/
 
 //from.disabled = true;
 //to.disabled = true;
}

Ca, ça ne fonctionne plus du tout :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
function resetFromTo(c, dates) {
var ref = document.getElementById('ref');
var from = document.getElementById('from');
var to = document.getElementById('to');
 
alert(ref.options[ref.selectedIndex].value);
 
//alert(ref.options[ref.selectedIndex].value);
//alert(ref.options[ref.selectedIndex].text);
from.selectedIndex = 0;
to.selectedIndex = 0;
 
/*for (i=0; i<dates.length; i++) {
if (c[i]==ref.selectedIndex.value) {
from.options.value = dates[i];
from.options.text = dates[i];
}
}*/
 
//from.disabled = true;
//to.disabled = true;
}

Je ne comprends rien. honnêtement, j'ai l'impression que ça ne marche que quand ça le veut.
Il y a bien quelque chose qui ne va pas dans mon code? Rassurez-moi (ou appelez un médecin).

25/06/2009, 22h47
Auteur

bonjour,

simple curiosité ton problème ne surviendrai pas sur IE ?

Par contre je ne vois pas de différence avec les deux derniers codes que tu as posté :koi: ("Ca, ça fonctionne aussi" et "Ca, ça ne fonctionne plus du tout").

Citation:

Envoyé par E.Bzz

Citation:

Envoyé par Goupo

Code:

alert(form.selectedIndex);

Code:

<select id="from" name="from" >

Mouais ... :aie:

Je suis du même avis que E.Bzz :aie:
26/06/2009, 09h06
Goupo

Salut,

Citation:

Envoyé par Auteur

simple curiosité ton problème ne surviendrai pas sur IE ?

Oui, même si ça craint, je dois utiliser ie6 qui est la norme dans ma boîte.

Citation:

Envoyé par Auteur

je ne vois pas de différence avec les deux derniers codes que tu as posté :koi: ("Ca, ça fonctionne aussi" et "Ca, ça ne fonctionne plus du tout").

Aussi surprenant que ça paraisse, la différence, c'est une ligne vide.

Je suis parvenu au bout de ce bug mais j'ai eu affaire à d'autre du même genre : "Changement insignifiant qui fait planter".

Je dois maintenant implémenter dans ma fonction la purge des listes from et to et leur remplissage par de nouvelles données. Je n'ai donc pas fini d'en baver avec ces bugs bizarres. Si vous savez à quoi j'ai à faire... Merci d'avance.

Citation:

Envoyé par Auteur

Je suis du même avis que E.Bzz :aie:

Et moi donc: :aie:

Voilà le code généré de mon from et de mon to :

Code:

1
2
3
4
5
6
7
8
9
10
 
<select id="from" name="from" >
   <option></option>   
   <option value="2008-12-31">31/12/2008</option>  
</select>
   au       
<select id="to" name="to" >
   <option></option>
   <option value="2008-12-31">31/12/2008</option>  
</select>

26/06/2009, 10h14
Auteur

Citation:

Envoyé par Goupo

Oui, même si ça craint, je dois utiliser ie6 qui est la norme dans ma boîte.

ma question n'était pas de savoir si IE "craint' mais de savoir si ce problème survenait sous IE. Visiblement comme tu utilise IE, lis ceci :
http://www.developpez.net/forums/d66...rer-variables/ :mrgreen:
Donc change le nom de tes variables, et là je pense que tout ira mieux ;)

[edit]
Comme le nom de tes varibale est identique aux valeurs de tes attributs name, IE ne sait pas à quel objet se réfèrent "from", "ref" et "to" (d'ailleurs "to" comme nom de variable ça, ça craint :aie:)
[/edit]
26/06/2009, 10h16
Goupo

J'ai cru remarquer que parfois il suffit que j'attende quelques minutes après une modification pour qu'elle s'arrête de planter on-ne-sait-pourquoi.

Ce ne serait peut-être pas un problème de code...

Est-ce que mon problème peut être du au placement des fichiers sur le serveur?
J'utilise Dreamweaver et je place mes fichiers sur le serveur après chaque modification pour tester.

Edit : Je viens de voir ton post ci-dessus.

Citation:

En fait sous IE, vous pouvez accéder directement à un objet en tapant son id (sous Firefox, vous devez passer par un document.getElementById()) donc dans l'exemple 2 quand vous écrivez

Code:

var from = document.getElementById('from');

Ca fonctionne aussi sous ie?
26/06/2009, 10h18
Auteur

Comme nos messages ont dû se croiser, je réécris ce que j'ai écrit précédemment ;)

Citation:

Envoyé par Auteur

Comme le nom de tes varibale est identique aux valeurs de tes attributs name, IE ne sait pas à quel objet se réfèrent "from", "ref" et "to" (d'ailleurs "to" comme nom de variable ça, ça craint )
26/06/2009, 10h26
Goupo

Il ne sait pas, mais si on lui précise comme ceci?

Code:

var from = document.getElementById('from');

Si jamais, j'appelle mes variables listRef, listFrom et listTo, ça craint moins?
26/06/2009, 10h31
E.Bzz

Citation:

Envoyé par Goupo

Si jamais, j'appelle mes variables listRef, listFrom et listTo, ça craint moins?

Beaucoup moins ....

A+