[JS] <option/> toevoegen aan <select/>

[Genoil]

Het lukt me prima om option elementen toe te voegen aan een select element:

code:

..
var option   = document.createElement("OPTION");

option.value = input.value;
option.text  = input.value;
select.appendChild(option);
            
//alert();
                        
select.options[select.length-1].text  = input.value;
select.options[select.length-1].value = input.value;

op zich is dit al vrij vreemd, want zowel de option moet aangemaakt worden (om evt. door te geven waarden goed te krijgen) , en de select variabele moet aangepast worden (om de tekst zichtbaar te maken). Dit staat ook in de MSDN lib.

Op bovenstaande manier werkt het, maar ik krijg wel steeds een "invalid index" error. Als ik die //alert(); weer aanzet, krijg ik em niet?! Wat doe ik hier verkeerd?

[Woudloper]

Ik heb het altijd zo gedaan:

JavaScript:

 var targetBox = findObject('lstcategorie');

 targetBox[index]= new Option('De tekst voor Display');
 targetBox[index].value =  123;  //De key voor de list (ofwel array)

Wellicht dat je hier wat aan hebt

[edit]
Overigens hierbij is findObject een standaard functie van Dreamweaver (uit mijn hoofd).

[ Voor 22% gewijzigd door Woudloper op 04-12-2002 16:45 ]

[r0bert]

JavaScript:

objSelect.options[objSelect.options.length] = new Option('text', 'value');

[r0bert]

Je eigen scriptje nog even

JavaScript:

var objOption   = document.createElement("OPTION");

objOption.value = objInput.value;
objOption.text  = objInput.value;
objSelect.options.appendChild(objOption);
            
//alert();

/* Waar dit voor nodig is, snap ik niet     
select.options[select.length-1].text  = input.value;
select.options[select.length-1].value = input.value;
*/

edit:
Sorry, dat ik deze post in een nieuwe reply heb geplaatst, maar ik kreeg het door problemen met ingelogt te blijven, niet voor elkaar mijn vorige post te editten..

[ Voor 20% gewijzigd door r0bert op 04-12-2002 19:54 ]

[Genoil]

r0bert schreef op 04 December 2002 @ 19:50:

JavaScript:

objSelect.options[objSelect.options.length] = new Option('text', 'value');

excellent! Ja die dubbelheid is idd raar. Kan ff niet meer vinden waar dat nou op MSDN stond. Maar jou oplossing is veel elganter en werkt als een tierelier. thnx

[thomaske]

het verschil is tussen de tekst en de value is:

code:

<option value="THE_VALUE">THE_TEXT</option>

de value wordt dus doorgestuurd bij submitten van je form, en de text is de zichtbare tekst van je option (wanneer er geen value is opgegeven, dan is de automatisch de tekst)