afficher une liste lors du click dans un input

Bonjour.

Je suis un peu débutant en javascript et je cherche a faire quelque chose dans le même genre que ce site la .Lorsque l'on clic sur le champ input de "From" ou de "To" et bien cela nous affiche une longue liste de champ dont les résultats se limitent au fur et a mesure que l'on entre le nom désiré.

Voila en espérant avoir été assez clair;

Merci.

Une autocompletion quoi ?

ouai ca ressemble pas mal a ce que je veux faire ^^.
Merci je vais plancher la dessus :)

Vraiment bien fait ce tuto :).

Cependant J'ai un problème avec la fonction generateOptions que voici :

Code:

---

1 2 3 4 5 6 7 8 9 10 11

function generateOptions($debut,$liste) { $MAX_RETURN = 10; $i = 0; foreach ($liste as $element) { if ($i<$MAX_RETURN && substr($element, 0, strlen($debut))==$debut) { echo(utf8_encode("<option>".$element."</option>")); $i++; } } }

---

Avec cette fonction la complétion ne marche plus avec les valeurs que j'ai rentrées dans mon tableau (valeur du type "Minneapolis, MN (MSP) ",... a savoir que j'ai plus de 3500 valeur dans mon tableau)

la complétion remarche lorsque je modifie la fonction generateOptions de mon fichier php

Code:

---

1 2 3 4 5 6 7

function generateOptions($debut,$liste) { foreach ($liste as $element) { echo(utf8_encode("<option>".$element."</option>")); } }

---

Mais j'ai encore quelques souci a savoir que la toutes les valeur de mon tableau s'affichent (et avec + de 3500 valeur vla la page que ca fait ^^). du coup j'ai beau saisir par exemple Paris j'ai toujours cette foutue liste de 3500 valeurs (au lieu justement de n'afficher que les valeur qui commencent par un p) qui reste affichée :(.

Quelqu'un aurait-il une idée d'ou pourrait venir le problème ? Je ne suis pas sur qu'il vienne de cette fonction mais j'ai suivi le tuto pas à pas et mon fichier javascript ansi que ma page html sont les mêmes donc je ne pense pas que ca vienne de ces fichiers.

Merci à ceux qui pourront m'aider :)

bon ben finalement j'ai trouvé une solution j'ai mis toutes les valeur de mon tableau en majuscule (car il s'agissait d'un problème de ce type le programme n'affichait pas ma liste de valeur lorsque celle-ci contenait des maj. et des min. j'ai pas compris pourquoi :X).

J'ai cependant un autre petit problème :

J'ai donc ma liste d'auto complétion qui marche et j'aimerai en rajouter une 2ème.Je modifie donc mon code html pour rajouter un formulaire une zone de saisie comme ceci :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12

<form name="form-test" id="form-test" action="javascript:alert('soumission de ' + document.getElementById('champ-texte').value)" style="margin-left: 50px; margin-top:20px"> <input type="text" name="champ-texte" id="champ-texte" size="50" autocomplete="off" /> <input type="submit" id="bouton-submit"> </form>       <form name="form-test2" id="form-test2" action="javascript:alert('soumission de ' + document.getElementById('champ-texte2').value)" style="margin-left: 50px; margin-top:20px"> <input type="text" name="champ-texte2" id="champ-texte2" size="50" autocomplete="off" /> <input type="submit" id="bouton-submit2"> </form>

---

et ensuite je modifie ma zone de script en initialisant une 2ème fois ma fonction d'auto complétion comme ceci

Code:

---

1 2 3 4 5 6 7 8 9 10

<script type="text/javascript"> window.onload = function() { initAutoComplete(document.getElementById('form-test'), document.getElementById('champ-texte'),document.getElementById('bouton-submit')); initAutoComplete(document.getElementById('form-test2'), document.getElementById('champ-texte2'),document.getElementById('bouton-submit2')); }; </script>

---

Et ce que je n'arrive pas a comprendre c'ets lorsque je test ma page avec mes 2 zones de saisie et bien il n'y en a plus qu'une qui marche (à savoir la 2ème).

Quelqu'un pourrait-il m'expliquer comment ca ce fait (Peut-être que je n'ai pas le droit d'initialiser ma fonction 2 fois de suite :X je sais pas :X)?

Merci.

quelq'un a-t-il une idée jme suis replonger dendans depuis ce soir et je ne vois pas pourquoi lorsque je met 2 champ cela ne mache plus :(.