2010-01-26 7 views
9

Desideri aggiungere un'opzione dinamicamente a un elemento Select utilizzando il prototipo.Aggiunta di un'opzione a un elemento di selezione con javascript utilizzando la libreria Prototype

Sembra esserci un sacco di modi diversi di farlo là fuori, tutto ciò che ha a che fare con options.add ecc ... Non è visto molto in termini di modalità cross-browser.

Vuoi che sia il più leggero possibile.

Questo è quello che ho ottenuto finora. È solo l'accodamento delle opzioni su cui sono bloccato:

var oNewOption = new Element('option').value=vItem; 
oNewOption.text=vItem; 

Qualche idea a qualcuno?

Grazie in anticipo!

risposta

11
select.insert(new Element('option', {value: myValue}).update(myLabel)); 

inserto accodamento al contenuto dello selezionare l'oggetto, l'aggiornamento aggiorna il contenuto del nuovo oggetto opzione.

Non molto meglio del modo classico, però.

+0

Questo ha funzionato come volevo fare, anche se per qualche motivo .insert() non restituiva l'elemento da aggiornare in modo tale: insert (opzione) .update (myLabel) non funzionava. Quindi modificato in: option.update (myLabel); select.inserire (opzionale); Il lavoro è un piacere. – jamesmhaley

+0

Se si guarda da vicino, _update_ si trova sull'oggetto restituito da _new_, non quello restituito da _insert_. – Alsciende

+0

Questo metodo funziona in IE7! –

25

Non c'è bisogno di prototipo, sarà altrettanto facile con il seguente metodo di tempo onorato che opera in tutti i principali browser desktop a partire dalla metà degli anni 1990:

// Assuming a select element stored in a variable called 'select' 
select.options[select.options.length] = new Option("Option text", "optionValue"); 
+0

Grazie ma cercavo di utilizzare il prototipo poiché il resto del codice utilizza il prototipo! Lo terrò presente in futuro quando usare il prototipo non è un requisito! – jamesmhaley

+8

Prototype è solo una libreria. Non è necessario usarlo per tutto, e nulla ti impedisce di mescolare i normali metodi DOM con il tuo codice Prototype. –

+4

+1. 'select.options.add (new Option ('foo', 'bar'))' è anche supportato abbastanza bene. –