auto complet pour sélectionner l'option en javascript

Je suis en train de faire la saisie semi-automatique pour sélectionner l'option en fonction de l'entrée de l'utilisateur

quelque chose comme 

  <input type=text onkeyup=findit()>

<select id="sel">
        <option value="s0001">Adams</option>
        <option value="s0002">Alder</option>
         .
         .
         .
<select>

J'ai trouvé ce code mais il ne fonctionne que sur un seul sélectionner dans la page( j'ai besoin de multi select)

<html>
<head>
<script type="text/javascript">
//initialize some global variables
var list = null;
function fillit(sel,fld) {
var field = document.getElementById("entry");
var selobj = document.getElementById("sel");
if(!list)
{
var len = selobj.options.length;
field.value = "";
list = new Array();
for(var i = 0;i < len;i++)
{
list[i] = new Object();
list[i]["text"] = selobj.options[i].text;
list[i]["value"] = selobj.options[i].value;
}
}
else
{
var op = document.createElement("option");
var tmp = null;
for(var i = 0;i < list.length;i++)
{
tmp = op.cloneNode(true);
tmp.appendChild(document.createTextNode(list[i]["text"]));
tmp.setAttribute("value",list[i]["value"]);
selobj.appendChild(tmp)/*;*/
}
}
}
function findIt(sel,field)
{
var selobj = document.getElementById("sel");
var d = document.getElementById("display");
var len = list.length;
if(field.value.length > 1)
{
if(!list)
{
fillit(sel,field);
}
var op = document.createElement("option");
selobj.options.length = 1
var reg = new RegExp(field.value,"i");
var tmp = null;
var count = 0;
var msg = "";
for(var i = 0;i < len;i++)
{
if(reg.test(list[i].text))
{
//d.childNodes[0].nodeValue = msg;
tmp = op.cloneNode(true);
tmp.setAttribute("value",list[i].value);
tmp.appendChild(document.createTextNode(list[i].text));
selobj.appendChild(tmp);
}
} 
}
else if(list && len > selobj.options.length)
{
selobj.selectedIndex = 0;
fillit(sel,field);
}
}
</script>
</head>
<body onLoad="fillit(sel,entry)">
<div>Enter the first three letters of a street and select a match from the menu.</div>
<form> 
Street
<input type="text" name="Street" id="entry" onKeyUp="findIt(sel,this)"><br>
<select id="sel">
<option value="s0001">Adams</option>
<option value="s0002">Alder</option>
<option value="s0003">bol</option>
<option value="s0004">col</option>
<option value="s0005">dol</option>
<option value="s0007">Cooper</option>
<!--and so on and so forth-->
</select> 
</form>
</body>

Toutes les Idées sur la Façon de le faire fonctionner sur une multi sélection sur la page?

Grâce

Baaroz

OriginalL'auteur baaroz | 2012-05-31

  1. 9

    Ne sais pas si cela pourrait fonctionner pour vous, mais chosen.js a une belle autocomple multi sélectionnez

    http://harvesthq.github.com/chosen/

    OriginalL'auteur MiGnH

  2. 0

    Généralement de saisie semi-automatique est pour les valeurs uniques, mais la jQuery UI autocomplete n'ont de multiples sélectionner la fonction. Essayez peut-être de ça? Un Minimum d'effort de codage pour vous de cette façon.

    OriginalL'auteur Jeff Watkins

  3. 0

    D'une drôle de façon de le faire est de modifier le code dans le script et de le copier, le nombre de fois que vous souhaitez utiliser cette option dans la page. ainsi, par exemple:

    select id="sel1"
select id="sel2"
select id="sel3"

    et puis. copiez le script et de le remplacer tous les (sel) avec sel1 passé à nouveau et de le remplacer (sel) avec sel2 et ainsi de suite.
    pas la meilleure solution mais il faudra travailler.
    Bonne Chance

    OriginalL'auteur Kareem