Reputation: 3864
Hi I have an ajax script which validates the users information put into textboxes. This is working fine in Internet Explorer, but in FireFox I get an error in getting the gender from a listbox. I have got the gender to be placed into a hidden textbox, for easier processing. The error I get in FF is
dd is null [Break on this error] theindex = dd.options[dd.selectedIndex].value;
My function in javascript is below, this is loaded on body load or once the gender selected is changed,
function get_gender()
{
{
var dd = document.getElementById("gender_select");
theindex = dd.options[dd.selectedIndex].value;
thevalue = dd.options[dd.selectedIndex].text;
}
document.getElementById("gender_text").value = thevalue;
}
One other problem I am having is hidding a div box, this works fine in every other browser but not IE. It should only show the div box once an error is given, but in IE the div box is always shown.
I am using this line to do this: document.getElementById("username_div").style.visibility = "hidden";
Rather than pasting all my code the live page can be viewed at
http://elliottstocks.com/assignment/sign_up/ Ignore the login box, this works fine.
Any comments/help will be appreciated. Thanks alot =)
Upvotes: 1
Views: 297
Reputation: 4573
For your second problem, you may want to try display = 'none'; for your element. Be aware that this behavior is different from visibility = hidden.
Upvotes: 0
Reputation: 1321
getElementByID requires the HTML element to have an ID, just a name isn't good enough.
<select name="gender_select" id="gender_select" onChange="get_gender()">
<option>Male</option> <option>Female</option>
</select>
Upvotes: 3
Reputation: 1038730
For the null error change:
<select onchange="get_gender()" name="gender_select">
to
<select onchange="get_gender()" name="gender_select" id="gender_select">
document.getElementById
is looking for an element in the DOM that has a given id
attribute. The reason it works in IE is because it allows selecting by name
attribute as well.
Upvotes: 2