Riempi l’input select con un input di testo

Al momento ho un’applicazione web che non supporta i multi selects in modo nativo e causa alcuni problemi con il mio design. Quindi quello che sto tentando di fare è creare una selezione multipla e creare uno script jquery per riempire una selezione multipla basata su un input di testo. Di seguito è riportato un collegamento di ciò che ho in corso al momento e funziona, ma solo per 1 selezione alla volta. Ne ho bisogno in modo che se un utente digita in test1, test2, test3 tutte e 3 di queste opzioni siano selezionate. Qualsiasi aiuto sarebbe apprezzato su questo.

http://jsfiddle.net/C83DB/11/

selectOptions = { test1: ["test1"], test2: ["test2"], test3: ["test3"] } $('#input').change(function() { if(selectOptions[$(this).val()]) { // does the option have an entry for the value of the textarea? $.each(selectOptions[$(this).val()], function() { // for each array item do $('#sel').append('' + this + ''); // append an option tag for the array item }); } }); 

Una soluzione migliore per lo stesso.

     
     
 I trimmed input field and splited it selectOptions = { test1: ["test1"], test2: ["test2"], test3: ["test3"] } $('#input').change(function() { //getting all values seperated by"," var values = $(this).val().split(","); values = $.map(values, function(elem) {return elem.trim()}); $.each(values, function(i, value) { if(selectOptions[value]) { $.each(selectOptions[value], function() { //append the option tag $('#sel').append(''); }); } }) }); 

Ho diviso e ritagliato il testo nel campo di input, in modo che un input come “test1, test2, test3” sia tradotto nei valori “test1”, “test2” e “test3”. Per ognuno eseguiamo un controllo nell’object selectOption

http://jsfiddle.net/dzda0xvL/3/

 selectOptions = { test1: ["test1"], test2: ["test2"], test3: ["test3"] } $('#input').change(function() { // get all values splited by "," var values = $(this).val().split(","); // remove blank space before and after each values values = $.map(values, function(elem) {return elem.trim()}); // for each value $.each(values, function(i, value) { // does the option have an entry for the value? if(selectOptions[value]) { // for each array item do $.each(selectOptions[value], function() { // append an option tag for the array item $('#sel').append(''); }); } }) });