PDA

View Full Version : Select box - onChange event handler



Alan
20 Jun 2009, 08:17 PM
Why oh why doesn't Javascript return error messages with a reason? Would definitely make things easier. I can't get this to work... :(

I want to select the different inputs based on the value in the select box. I just can't seem to get it working. (There will be only 2 values in the select box).

Here's my attempt at it.


<!-- Head section -->

<script language="Javascript">
function switch_form() {
var form1 = document.getElementByID('form1');
var form2 = document.getElementByID('form2');

if(form1.style.display == "none") {
form1.style.display = "inline";
form2.style.display = "none";
}
else {
form2.style.display = "inline";
form1.style.display = "none";
}
}
</script>

<!-- Body section -->

<form method="post" action="">

<div>Form selection</div>
<div><select name="select" onChange="switch_form()">
<option value="form1">Form 1</option>
<option value="form2">Form 2</option>
</select></div>

<div id="form1" style="display: inline;">
<div>Label 1</div>
<div><input type="text" name="input1" size="10" value=""/></div>
</div>

<div id="form2" style="display: none;">
<div>Label 2</div>
<div><input type="text" name="input2" size="10" value=""/></div>
</div>

</form>


Maybe I could use an onClick event handler in the select box's options? Just a thought. Thanks in advance for any help, this has been a thorn in my side for many an hour. :)