Discussion :

[Invité]

Bonjour,
je vous expose mon problème:

J'ai deux listes non liées dans un formulaire pour des raisons pratique.
Mon but est de ne sélectionné qu'une seule valeur sur les deux listes présentes.

voici ce que j'ai mis en place en javascript:

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function sursubmit(selection)
{
	//la liste2 est selectionné  
	//je déselectionne chaque élement de la  liste1   
	if (selection=='liste1')
	{
		for (var i=0; i<document.formulaire.liste1.options.length; i++) 
		{
			document.formulaire.liste1.options[i].selected = false;
		}
	}
 
	//la liste1 est selectionné  
	//je déselectionne chaque élement de la  liste2  
	if (selection=='liste2')
	{
		for (var i=0; i<document.formulaire.liste2.options.length; i++) 
		{
			document.formulaire.liste2.options[i].selected = false;
		}
	}
}

et ceux à quoi ressemble le formulaire:

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
<form name="formulaire" method="POST" action="resu.asp">
 
	<select name="liste1" size="10" id="liste1" onClick="sursubmit('liste2');">
	...
	</select>
 
	<select name="liste2" size="10" id="liste2" onClick="sursubmit('liste1');">
	...
	</select>
 
</form>

Tout ceci fonctionne parfaitement sous Firefox,Opéra,Safari,Chrome...
Mais pas sous Internet Explorer

Auriez-vous une idée?

[SpaceFrog]

pourquoi pas juste modifier le selectedIndex de l'autre liste sur le onchange avec un test de selection ?

[Invité]

oui effectivement c'est possible cela me donne le script suivant:

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function sursubmit(selection)
{
	if (selection=='liste1')
	{
		if (document.getElementById('liste1').selectedIndex>0)
			document.getElementById('liste1').options[document.getElementById('liste1').selectedIndex].selected=false;
	}
 
	if (selection=='liste2')
	{
		if (document.getElementById('liste2').selectedIndex>0)
			document.getElementById('liste2').options[document.getElementById('liste2').selectedIndex].selected=false;
	}
}

mais mon problème reste identique:
internet explorer ne me l'interprète toujours pas correctement, alors que tout les autres navigateurs le font...

[SpaceFrog]

essaye selected = 0 ?

[Invité]

j'ai bien essayé, mais aucune amélioration...

[E.Bzz]

Bonjour,

internet explorer ne me l'interprète toujours pas correctement, alors que tout les autres navigateurs le font...

N'est-ce pas à cause de la gestion des évènements qui est légèrement différente ?
Pour IE (6 en tous cas), le onclick se déclenche avant que la nouvelle valeur soit prise en compte.

Code :

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

<select onclick="alert('clic:'+this.value);"  onchange="alert('change:'+this.value);">

Essaye avec onchange au lieu de onclick ....

EDIT : c'est évident, puisqu'il faut déjà cliquer une fois pour pouvoir choisir la nouvelle valeur

A+

[Invité]

j'ai essayé ceci :

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
<form name="formulaire" method="POST" action="resu.asp">
 
	<select name="liste1" size="10" id="liste1" onChange="sursubmit('liste2');">
	...
	</select>
 
	<select name="liste2" size="10"  id="liste2" onChange="sursubmit('liste1');">
	...
	</select>
 
</form>

mais aucune amélioration.

[E.Bzz]

Code :

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

1
2
3
4
5
if (selection=='liste1')
{
if (document.getElementById('liste1').selectedIndex>0)
   document.getElementById('liste1').selectedIndex = -1;
}

A+

[E.Bzz]

Attention, si ta première ligne a une valeur il faut tester

Code :

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

if (document.getElementById('liste1').selectedIndex>=0)

Sinon ça ne fonctionnera pas si la sélection est sur cette première ligne ...

A+

[Invité]

oui tu a raison pour le test :

Code :

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

if (document.getElementById('liste1').selectedIndex>=0)

merci.

en revanche le:

Code :

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

   document.getElementById('liste1').selectedIndex = -1;

ne fonctionne pas.

[E.Bzz]

en revanche le:

Code :

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

document.getElementById('liste1').selectedIndex = -1;

ne fonctionne pas.

Sous IE 6, si (testé)

EDIT : ainsi que sous FF3 (testé à l'instant)

A+

[Invité]

Mea culpa, mea maxima culpa

Je t'ai mal relu d'où mon erreur,
Tu a raison cela fonctionne desormais sur Firefox 3, Opéra 9, Safari, Chrome
ainsi que sur internet explorer 6 et 7.

Donc voici un récapitulatif du résultat:

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function sursubmit(selection)
{
	if (selection=='liste1')
	{
		if (document.getElementById('liste1').selectedIndex>=0)
			document.getElementById('liste1').selectedIndex = -1;
	}
 
	if (selection=='liste2')
	{
		if (document.getElementById('liste2').selectedIndex>=0)
			document.getElementById('liste2').selectedIndex = -1;
	}
}

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
<form name="formulaire" method="POST" action="resu.asp">
 
	<select name="liste1" size="10" id="liste1" onClick="sursubmit('liste2');">
	...
	</select>
 
	<select name="liste2" size="10"  id="liste2" onClick="sursubmit('liste1');">
	...
	</select>
 
</form>

ps: j'ai garder les onClick qui fonctionne ...

Merci E.Bzz & SpaceFrog

Aller un p'tit pour la peine !!!