liste deroulante html plusieurs colonnes

**bb62** · 23/07/2007, 16h29

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

**E.Bzz** · 23/07/2007, 16h52

Bonjour,

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+

**bb62** · 23/07/2007, 16h59

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

Merci d'avance.

**E.Bzz** · 23/07/2007, 17h16

Quelque chose comme ça :

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
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+

**bb62** · 23/07/2007, 17h28

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

liste deroulante html plusieurs colonnes

JavaScript

Discussions similaires

Partager

Partager