"autocompletion" sur un select

**DoubleU** · 04/09/2009, 16h33

Besoin:
Permettre à l'utilisateur de sélectionner rapidement une option dans un select qui en compte plusieurs (milliers dans mon cas, correspondant à des codes de produit).
Souvent, l'utilisateur connait le code du produit, l'idée est donc de lui permettre de taper le code du produit (un peu comme une autocomplétion), sauf qu'au lieu d'être sur un champ texte, elle se fait sur un select.

Utilisation:
La classe se plug directement sur le select, c'est à dire qu'il ne nécessite pas de modification sur son code html.
A chaque lettre tapée, une expression régulière vérifie et ne garde dans la liste que les otions correspondantes au masque. Les lettres précédentes sont conservées pour augmenter le masque à chaque fois.
La touche <-- permet de supprimer le dernier caractère du masque, ECHAP de réinitialiser le masque.

NB:
Dans mon cas, la saisie devait correspondre aux premières lettres du code du produit, donc l'expression régulière qui utilise le masque doit être changée pour toute autre utilisation.
La première option du select ne correspond pas a une vraie option, mais un indication du genre "choissez". Il faudrait modifier le code pour changer ca si besoin.

Exemple:

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
<html>
 
	<head>
		<script type="text/javascript" src="autocomplete.js"></script>	
	</head>
	<body>
		<select id="foo">
			<option>Choisissez</option>
			<option value="foo">foo</option>
			<option value="ffoo">ffoo</option>
			<option value="fooo">fooo</option>
			<option value="bar">bar</option>
			<option value="bbar">bbar</option>
			<option value="baar">baar</option>
			<option value="foobar">foobar</option>					
		</select>
		<script> new autocomplete(document.getElementById("foo"))</script>
	</body>
 
 
</html>

**sanaaa123** · 18/04/2010, 15h46

j'ai repri ton code, que j'ai adapté au mien.
quand je tape par exemple 1752, sa me l'affiche, et quand je clique sur valider pour passer a la page suivante, sa me réaffiche la même page, comme si la valeur chosie dans ma liste déroulante est vide.

ta compri mon probleme.

merci davance

"autocompletion" sur un select

Contribuez

Discussions similaires

Partager

Partager