Faire des recherches dans un select
Résolu
titietmatt
Messages postés
8
Date d'inscription
Statut
Membre
Dernière intervention
-
titietmatt Messages postés 8 Date d'inscription Statut Membre Dernière intervention -
titietmatt Messages postés 8 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
J'ai un select qui envoie l'id d'une unité. Etant donné qu'il y a beaucoup d'unités dans la liste (elles sont triées par ordre alphabétique), j'aimerai que, lorsque l'utilisateur tape les premières lettres de l'unité qu'il veut, l'unité vienne se mettre.
Exemple :
J'ai Antwerpen, Namur, Bruxelles, Renaix, Uccle,.... commes unités.
J'aimerais que, quand je tape bru, il vienne se mettre sur le premier Bruxelles (en effet, il se peut que j'ai plusieurs unités commençant par le même nom).
Pour le moment, quand je tape bru, il se met sur bruxelles, puis sur Renaix, puis sur Uccle. En fait, il prend chaque lettre que je tape comme première lettre d'une unité et non pas comme un début de nom d'unité. Or, c'est ce que je voudrais qu'il fasse, qu'il prenne bru comme les premières lettres de Bruxelles.
Mon programme est en php/mysql.
Le select est comme ça :
<select name="unite">
<option value='1'>Antwerpen</option>
<option value='2'>Namur</option>
<option value='3'>Bruxelles</option>
<option value='4'>Bruxelles 2</option>
<option value='5'>Bruxelles 3</option>
<option value='6'>Bruxelles 4</option>
<option value='7'>Renaix</option>
<option value='8'>Uccle</option>
</select>
Je crois que j'ai besoin de javascript pour cela mais pouvez-vous me dire comment faire?
Merci beaucoup
J'ai un select qui envoie l'id d'une unité. Etant donné qu'il y a beaucoup d'unités dans la liste (elles sont triées par ordre alphabétique), j'aimerai que, lorsque l'utilisateur tape les premières lettres de l'unité qu'il veut, l'unité vienne se mettre.
Exemple :
J'ai Antwerpen, Namur, Bruxelles, Renaix, Uccle,.... commes unités.
J'aimerais que, quand je tape bru, il vienne se mettre sur le premier Bruxelles (en effet, il se peut que j'ai plusieurs unités commençant par le même nom).
Pour le moment, quand je tape bru, il se met sur bruxelles, puis sur Renaix, puis sur Uccle. En fait, il prend chaque lettre que je tape comme première lettre d'une unité et non pas comme un début de nom d'unité. Or, c'est ce que je voudrais qu'il fasse, qu'il prenne bru comme les premières lettres de Bruxelles.
Mon programme est en php/mysql.
Le select est comme ça :
<select name="unite">
<option value='1'>Antwerpen</option>
<option value='2'>Namur</option>
<option value='3'>Bruxelles</option>
<option value='4'>Bruxelles 2</option>
<option value='5'>Bruxelles 3</option>
<option value='6'>Bruxelles 4</option>
<option value='7'>Renaix</option>
<option value='8'>Uccle</option>
</select>
Je crois que j'ai besoin de javascript pour cela mais pouvez-vous me dire comment faire?
Merci beaucoup
A voir également:
- Faire des recherches dans un select
- Recherche automatique des chaînes ne fonctionne pas - Guide
- Comment faire une recherche à partir d'une photo - Guide
- Reboot and select proper boot device asus - Forum Matériel & Système
- Rechercher un mot dans word - Guide
- Je recherche un film que j'ai vu - Forum Cinéma / Télé
1 réponse
Bonjour,
Oui ta raison, ta besoin d'un code javascript pour l'autocompletion.
Tu peux meme enlever la liste et ne laisser qu'un champ input simple, et declarer pour ce champ onKeyUp="AutoComplete()"
Pour la fct AutoComplete, tu peux télécharger plein d'exemples que tu peux adapter et c'est facile
Bon courage ;)
Oui ta raison, ta besoin d'un code javascript pour l'autocompletion.
Tu peux meme enlever la liste et ne laisser qu'un champ input simple, et declarer pour ce champ onKeyUp="AutoComplete()"
Pour la fct AutoComplete, tu peux télécharger plein d'exemples que tu peux adapter et c'est facile
Bon courage ;)
Et, pour éviter de parcourir toute la liste des unités commençant par bruxelles (par exemple), je voudrais qu'il prenne plus de lettres que la première quand j'en tape plusieurs au clavier (au lieu de chercher dans la liste).
Ce n'est pas un champ à compléter manuellement.
Mais merci quand-même
Sinon tu peux garder tjrs ton select. et tu peux mettre ta fonction javascript AutoComplete dans un evenement onKeyUp relative a la select.
Dans cette fonction, tu peux récupéré la liste d'unité dans un tableau de type Array que tu va utiliser par la suite dans ton autocompetion.
Rq : tu va trouver facielement le code de l'autocompletion qui prend comme argument un tableau et une chaine ;)
J'ai réussi à faire ce que je voulais avec JS.
Voilà ma page test en php (sup.php)
<?
//récupération du bouton
$bouton=$_POST['bouton'];
//ma fonction javascript qui permet de créer plusieurs listes différentes
echo "<script language='javascript'>
function changer(choixselect)
{
var tableau=new Array();
var i=0;
var rech='';
//création du tableau pour la recherche + mise à 0 de la liste voulue +
//initialisation de la variable rech avec ce qu'on cherche (les lettres entrées au clavier)
switch(choixselect)
{
case 'unite' :
{";
$req=mysql_query("select distinct num_eenheid,unite from tbleenheid where actif='O' order by unite asc");
while($res=mysql_fetch_row($req))
{
echo "
tableau[i]=new Array(2);
tableau[i][0]=",$res[0],";
tableau[i][1]=\"",stripslashes($res[1]),"\";
i=i+1;";
}
echo "
rech=document.form1.unite.value;
document.form1.idunite.options.length=0;
break;
}
case 'docutype' :
{";
$req=mysql_query("select * from tbldocutype order by type_docu asc");
while($res=mysql_fetch_row($req))
{
echo "
tableau[i]=new Array(2);
tableau[i][0]=",$res[0],";
tableau[i][1]=\"",stripslashes($res[1]),"\";
i=i+1;";
}
echo "
rech=document.form1.docutype.value;
document.form1.iddocutype.options.length=0;
break;
}
}
//création de la liste des option du select
var liste='';
for(var j=0; j<i; j++)
{
var chaine=tableau[j][1];
var chainerech = chaine.toLowerCase();
if(chainerech.indexOf(rech)!='-1')
{
liste=new Option(chaine,tableau[j][0]);
//ajout de la liste au select
switch(choixselect)
{
case 'unite' : { document.form1.idunite.options[document.form1.idunite.options.length]=liste; break; }
case 'docutype' : { document.form1.iddocutype.options[document.form1.iddocutype.options.length]=liste; break; }
}
}
}
}
</script>
//mon formulaire
<form name=form1 action=sup.php method=post><table><tr><td>
<input type='hidden' name='",session_name(),"' value='",session_id(),"'>
<input type='text' name='unite' value=\"$unite\" onkeyup=\"javascript:changer('unite');\" autocomplete='off'> ";
echo "<select name='idunite' id='idunite'>
</select><br><br>
<input type='text' name='docutype' value=\"$docutype\" onkeyup=\"javascript:changer('docutype');\" autocomplete='off'> ";
echo "<select name='iddocutype' id='iddocutype'>
</select>
<input type=submit name='bouton' value='Voir'></form>";
if(!empty($bouton)) echo $_POST['idunite'];
?>
juste une 'tite question encore : pouvez-vous me dire comme je peux faire dans ma fonction changer pour pouvoir utiliser la valeur de choixselect?
ex : au lieu de faire
switch(choixselect)
{
case 'unite' : { document.form1.idunite.options[document.form1.idunite.options.length]=liste; break; }
case 'docutype' : { document.form1.iddocutype.options[document.form1.iddocutype.options.length]=liste; break; }
}
j'aimerais faire
var idchoix='id'.choixselect;
document.form1.'valeur de idchoix'.options[document.form1.'valeur de idchoix'.options.length]=liste;
ça serai plus court surtout s'il y en a d'autres qui s'ajoutent après.
Mais sinon, ça marche bien.