liste deroulante html plusieurs colonnes

Version imprimable

23/07/2007, 15h29
bb62

liste deroulante html plusieurs colonnes

Bonjour à tous,

Voici mon problème

j'ai une liste deroulante avec des codes et des libelles exemple :
1 - aaaa
2 - bbbb
3 - cccc

lorsque je la déroule je doit avoir les deux colonnes qui apparaisse comme ceci :
1 - aaaa
2 - bbbb
3 - cccc

et quand je ne la deroule pas je doit avoir que la premiere colonne qui s'affiche

1 ou 2 ou 3

Est-ce que cela est possible?

Merci d'avance
23/07/2007, 15h52
E.Bzz

Bonjour,

Citation:

Envoyé par bb62

Est-ce que cela est possible?

en HTML, non, mais puisque tu as posté dans le forum Javascript :
le plus simple semble être de créer ton select "normal" :
1 - aaaa
2 - bbbb
3 - cccc
avec des value uniquememnt 1, 2 et 3

Une fois ta ligne sélectionnée (sur onchange), tu remplaces (display : block/none) ton select par un input "text" contenant uniquement la value de la ligne sélectionnée.
Au clic sur l'input, tu fais le remplacement inverse ...

EDIT : tu pourrais modifier les libellés de tes <options> au fur et à mesure des sélections, mais ça me semble plus lourd ...

A+
23/07/2007, 15h59
bb62

euh, pourrai-tu me donner un petit exemple car la cela me semble un peu confus?

Merci d'avance.

Quelque chose comme ça :

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
<script type="text/javascript">
<!--
function MajAff(choix)
{	if (choix) {
		with (document.getElementById("l_input")) {
			style.display="none";
			value="";
		}
		document.getElementById("la_liste").style.display="block";
	}
	else {
		document.getElementById("la_liste").style.display="none";
		with (document.getElementById("l_input")) {
			style.display="block";
			value=document.getElementById("la_liste").value;
		}
	}
}
 
-->
</script>
</head>
<body>
<input type="text" id="l_input" style="width:100px;display:block;" onclick="MajAff(true);">
<select name="la_liste" id="la_liste" style="width:100px;display:none;" onchange="MajAff(false);">
	<option value="1">1 - aaaa</option>
	<option value="2">2 - bbbb</option>
	<option value="3">3 - cccc</option>
</select>

A améliorer en fonction de ta page, bien sûr ;)

A+

23/07/2007, 16h28
bb62

Ben en fait se n'est pas trop ce que j'aimerai avoir.

Il ne faut pas de zone de texte mais je dois avoir toujours la zone de liste qui m'afficher 1 ou 2 ou 3 quand on ne change pas de valeur et quand on change de valeur la liste se deroule en entier avec le code + le libelle.

Merci d'avance