Storing Selected Option in HTML Form Menu into a Javascript Variable

[davem2312]

Hi all,

I am trying to make dynamic HTML form menus. When someone selects an option in one menu, I want the others to change. So here is my problem.

My script works perfectly in Firefox, but does not in IE. I have diagnosed the problem to this:

function change_subtype(chosen_fence) {
fence = (chosen_fence[chosen_fence.selectedIndex].value);
<!-- There are some other lines of code in here -->
}
function change_height(chosen_subtype) {
subtype = (chosen_subtype[chosen_subtype.selectedIndex].value);
<!-- Theres some other stuff here, but this line i know is the problem.-->
}

The top function works in both IE and Firefox, but the bottom one only works in Firefox, NOT IE. The two menus that this apply to are as shown here.

<select name="type" onchange="javascipt:change_subtype(this)">

<!-- There are some other lines of code in here -->
<select name="subtype" onchange="javascript:change_height(this)">


I have tried renaming the variable, and storing something else into it. Doing this, I have diagnosed that the problem lies in the calling of the variable from the form, not in the assignment or use of the variable.
I hope this is enough information to help me. Thanks all.

[zygh]

<select name="type" onchange="javascipt:change_subtype(this)">

<!-- There are some other lines of code in here -->
<select name="subtype" onchange="javascript:change_height(this)">

u don't need the "javascript:" part to call functions.... that might have messed it up.... other then that i have no clue....

[davem2312]

Nope, that doesn't do it. I tried that before too, I just didn't mention it. I have no idea what could cause this difference in IE.

[BrownBear]

"javascript:" not needed, but does not do any bad, because it treated as label in event handler :)

First thing to try would be to use chosen_subtype.options[chosen_subtype.selectedIndex] instead of chosen_subtype[chosen_subtype.selectedIndex]

Than you can try is to use the same function in both cases

function getValue(sel)
{
return sel.options[sel.selectedIndex].value
}

<select name="type" onchange="fence = getValue(this);">
<select name="subtype" onchange="subtype = javascript:getValue(this)">

[davem2312]

What I did is I realized that IE was getting the correct selectedIndex... but it was not getting the value. Seeing that I was pressed for time, I converted all my use of the value to use of the numbered index.