this.options[this.selectedIndex].value not working!!

[werXor]

Hi!

I'm getting the error on a dropdownlist using javascript:
"Objects doesnt support this property or method".

I've tried:
document.getElementById('name').options[document.getElementById('name').selectedIndex].value

var nan = document.getElementById('name').options[document.getElementById('name').selectedIndex].value;
if(nan)
{
if(nan=='Ceasar')
{
document.getElementById('company').value = 'MyCompany';
}
}

Why is this not working?

Please help!


//werXor

[Spudhead]

'name' is a reserved word. I wouldn't call any HTML elements 'name'. Other than that it all looks ok?

[werXor]

Hi Spudhead!

And thanks for your reply!

Well the actual name is something else in VS and on the control: the actual name is "enhr" but since that's not relevant I just named it 'name' in the code snippet. =)

when I used this.options....... i got "undefined error"
then when I used document.getelementById('enhr').options.....
I got the error:
Object doesnt support this property or method

Any ideas?

[werXor]

One thing I forgot to tell is that the error:
"Object doesnt support this property or method"

Only occurs the first time I click on the control.

When I've selected a value in the dropdownlist and it posts back the second time the error disappear...

why is this?

anyone else had problems with the this.option[this.selectedIndex].value?

please help!!

[Kor]

Your element must have an id,as long as you have used getElementById().

Can we see your list box (the select and the 2-3 options)? What event have you used? Which is the event which trigger the function... by the way, do you have a function?

[werXor]

event onChange

Hi Kor!

And thanks for your response!

Yes i have a function called setCompany, which is triggered on the event "onChange".

Code snippet:

setCompany()
{
//This is the line that gives me the error on the first postback (click on the control)!
var nan = document.getElementById('enhr').options[document.getElementById('enhr').selectedIndex].value;
if(nan)
{
if(nan=='Volvo AB')
{
document.getElementById('companylstNr').value = '2';
}
}


}



<td width="120">company:</td>
<td><asp:dropdownlist id="enhr" runat="server" AutoPostBack="True" onchange="setCompany();" cssclass="selectedbox">
<asp:ListItem Value="-- Choose company --">-- Choose Company --</asp:ListItem>
<asp:ListItem Value="- - - - - - - - - - - - - - - - - - - - - - - - - ">- - - - - - - - - - - - - - - - - - - - - - - - - </asp:ListItem>
<asp:ListItem Value="MyComp AB">MyComp AB</asp:ListItem>
<asp:ListItem Value="Volvo AB">Volvo AB</asp:ListItem>
<asp:ListItem Value="Saab AB">Saab AB</asp:ListItem>
<asp:ListItem Value="Renault AB">Renault AB</asp:ListItem>
<asp:ListItem Value="Ford">Ford</asp:ListItem>
</asp:dropdownlist><br>

Any ideas?

[Kor]

use this self reference, and simply value, as for list boxes which are not multiple, the select object's value take always the value of the selected option.

and a function must be set as a function:

function setCompany(val)
{
if(val=='Volvo AB'){
document.getElementById('companylstNr').value = '2';
}
}
........
onchange="setCompany(this.value)"
...