completamento automatico per selezionare l'opzione in javascript

Sto cercando di rendere automatico completo per selezionare l'opzione in base alla input da parte dell'utentecompletamento automatico per selezionare l'opzione in javascript

qualcosa come

<input type=text onkeyup=findit()> 

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

Ho trovato questo codice ', ma funziona solo su un seleziona nella pagina (Ho bisogno di selezionare multipla)

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

Qualsiasi idea Come farlo funzionare su multi selezione sulla pagina?

Grazie

Baaroz

fonte

2012-05-31 baaroz

Non sono sicuro se questo dovrebbe funzionare per voi, ma chosen.js ha davvero un bel più autocomple selezionare

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

fonte

2012-05-31 10:22:45 MiGnH

Ottima soluzione grazie – baaroz

Grazie mille variare! E 'stato davvero utile! – Maria

solito completamento automatico è per valori singoli, ma la jQuery UI autocomplete ha una funzione di selezione multipla. Forse provarlo? Codice di sforzo minimo per te in questo modo.

fonte

2012-05-31 10:19:32

uno strano modo per farlo è quello di modificare l'ID nello script e copiarlo il numero di volte in cui desideri utilizzare queste opzioni nella pagina. per esempio:

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

e poi. copia lo script e sostituisci ogni (sel) con sel1 nuovamente passato e sostituisci (sel) con sel2 e così via. non è la soluzione migliore ma funzionerà. Good Luck

fonte

2013-03-16 14:36:49 Kareem

completamento automatico per selezionare l'opzione in javascript

risposta

Problemi correlati