Discussion :

[Postal]

Bonjour,

J'ai un problème avec des listes liées. Je précise que cela se produit uniquement sur IE10, cela fonctionne parfaitement sur IE9, Firefox et Chrome.
Ce problème se produit lorsque l'attribut size est "setté" (valeur différente de 1) au niveau de la liste enfant.

Sur ma page de test, il y a deux listes déroulantes, après sélection d'une valeur dans la première la seconde liste est rafraîchie. Cela est fait en javascript.

Ce rafraîchissement s'effectue correctement. Par contre, il m'est impossible de sélectionner une valeur dans la seconde liste.

La page

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<form name="testForm" action="#">
	<label class="label">Liste 1</label> 
	<select name="liste1" id="liste1">
		<option value="MR">MR</option>
		<option value="MME">Madame</option>
		<option value="MLE">MLE</option>
	</select> 
	<label class="label">Liste 2</label>
	<select name="liste2" size="3"></select>
</form>

Le javascript

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
jQuery("#liste1").change( function (){
	reloadListTest(document.testForm.liste1, document.testForm.liste2);
});//change
function reloadListTest(listfrom, listto) {
	if (listfrom.selectedIndex != -1) {
		listto.options.length = 3;
		listto.options[0].value = "0";
		listto.options[0].text = "val"+ listfrom.options[listfrom.selectedIndex].value;
		listto.options[1].value = "1";
		listto.options[1].text = "val"+ listfrom.options[listfrom.selectedIndex].value;
		listto.options[2].value = "2";
		listto.options[2].text = "val"+ listfrom.options[listfrom.selectedIndex].value;
	}
}

Est-ce que quelqu'un à une piste ?

Je précise que passer l'attribut size à "1" n'est pas une solution.

Par avance merci

[Bovino]

Peut-être qu'IE 10 gère mal une balise <select> vide avec un attribut size ?
Tu devrais essayer en ne mettant pas d'attribut et en fixant la valeur après avoir rempli le select.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<select name="liste2" size="3"></select>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
jQuery("#liste1").change( function (){
	reloadListTest(document.testForm.liste1, document.testForm.liste2);
});//change
function reloadListTest(listfrom, listto) {
	if (listfrom.selectedIndex != -1) {
		listto.options.length = 3;
		listto.options[0].value = "0";
		listto.options[0].text = "val"+ listfrom.options[listfrom.selectedIndex].value;
		listto.options[1].value = "1";
		listto.options[1].text = "val"+ listfrom.options[listfrom.selectedIndex].value;
		listto.options[2].value = "2";
		listto.options[2].text = "val"+ listfrom.options[listfrom.selectedIndex].value;
		listto.size = 3;
	}
}

[Postal]

Ce n'est pas mieux par contre en écoutant onclick et non onchange cela semble mieux fonctionner

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
jQuery("#liste1").click( function (){
	reloadListTest(document.testForm.liste1, document.testForm.liste2);
});//change

Je vais tester "grandeur nature" avant de clôturer ce billet.