[Javascript & IE]Geen veldcheck mogelijk dynamische listbox? - Softwareontwikkeling

donderdag 16 maart 2006 11:07

Acties:

Topicstarter

Onder firefox werkt de onderstaande code prima, maar IE een probleem. Zal het even beschrijven..

Ik vul een listbox (select2) op basis van de keuze in de listbox (select1) erboven met javascript. Deze code voor de velden staat in de <head> tag van de pagina:

code:

function setOptions(o) 
{ 
var select2 = document.form1.select2; 
select2.options.length = 1; 
if (o == "keuze1") 
    { 
        select2.options[select2.options.length] = new Option('Locatie1);
        select2.options[select2.options.length] = new Option('Locatie2'); 
        select2.options[select2.options.length] = new Option('Locatie3'); 
    }
}

etc etc

Listboxes zien er zo uit:

code:

<select name="select1" size="1" onchange="setOptions(document.form1.select1.options[document.form1.select1.selectedIndex].value);"> 
    <option value="">---------------</option>
    <option value="keuze1">Vestiging1</option>
    <option value="keuze2">Vestiging2</option>
</select>

<select name="select2" size="1">
    <option value="">---------------</option>
</select>

De code werkt prima, geen problemen. Maar nu... ik doe met javascript een veld check op de select1 en select2 listboxes.. (hij checkt bij de listbox of "value" groter is dan niets, wat zo is als je een optie selecteerd)

code:

function checkform()
{
else if (!document.form1.select1.value)
    {
        alert('U heeft uw vestiging niet opgegeven');
        return false;
    }
    else if (!document.form1.select2.value)
    {
        alert('U heeft uw locatie niet opgegeven');
        return false;
    }
}

De velden check wordt via "onSubmit="return checkform()"" in de <form> tag aangeroepen. Als ik nu in het eerste listbox iets selecteer en in de tweede niets dan zien beide browsers keurig dat dat niet mag. Alleen IE blijft zeggen dat het de tweede listbox leeg is ook al heb ik iets geselecteerd.
Komt dit omdat het dynamisch ingeladen wordt op basis van het eerste veld, en het in de html bron in principe "leeg" ingeladen wordt? Is dit een beperking van IE die Firefox niet heeft?

I'm puzzled..

donderdag 16 maart 2006 11:09

Acties:

André

Analytics dude

Probeer eens via het DOM te checken of er uberhaupt options zijn in select2 door de length van de childNodes op te vragen

donderdag 16 maart 2006 11:32

Acties:

ViNyL

Topicstarter

Zou dat wel werken? Als je namelijk de bron bekijkt in IE of Firefox dan is de 2de listbox gewoon hetzelfde als in mijn editor:

code:

1
2
3

<select name="select2" size="1">
    <option value="">---------------</option>
</select>

donderdag 16 maart 2006 11:54

Acties:

André

Analytics dude

Dat komt omdat je met je 'bronviewer' ook niet de echte bron krijgt te zien maar gewoon de HTML pagina zoals hij de browser 'aankomt'

Je kunt in Firefox wel gebruiken maken van de DOM Inspector, die laat wel de realtime code zien.

donderdag 16 maart 2006 12:06

Acties:

ViNyL

Topicstarter

Hmm moet ik daar maar eens even induiken hoe dat werkt. Ik dank u vriendelijk!

donderdag 16 maart 2006 15:56

Acties:

crisp

Devver

Pixelated

JavaScript:

1	var option = new Option(sText, sValue);

Jij kent alleen een text toe aan je nieuwe opties en geen expliciete values. Dat gecombineerd met het feit dat IE stom is bezorgt je nu een probleem

Overigens zou ik ipv document.form1.blabla gewoon een referentie naar je formulier meegeven mbv het this keyword.

[ Voor 22% gewijzigd door crisp op 16-03-2006 15:57 ]

Intentionally left blank