[SOLVED] Using JavaScript to show/hide forms
Posted: Sat Jan 27, 2007 10:56 pm
What I've got is a drop-down menu with 3 selections. When a user selects "Loader", I would like to display/un-hide. I've used this code on one of my other scripts and it works just fine, but I'm not sure why it doesn't work here. Here is a basic version of the code. When I select something from the drop-down menu, nothing happens at all.
Code: Select all
<div id="load" style='display: none'>content{/div>Code: Select all
<html>
<head>
<script>
function WhichForm(frm)
{
if(!frm.eval_form.selectedIndex == 1)
frm.eval_form.focus()
}
</script>
<script>
function WhichForm(frm)
{
if(frm.eval_form.selectedIndex == 1)
document.getElementById("load").style.display = '';
else
document.getElementById("load").style.display = 'none';
}
</script>
<script>
function WhichForm(frm)
{
if(frm.eval_form.selectedIndex == 2)
document.getElementById("belt").style.display = '';
else
document.getElementById("belt").style.display = 'none';
}
</script>
<script>
function WhichForm(frm)
{
if(frm.eval_form.selectedIndex == 3)
document.getElementById("ic").style.display = '';
else
document.getElementById("ic").style.display = 'none';
}
</script>
</head>
<body>
<p align="center"><font size="+2">HUB METHODS EVALUATIONS</font></p>
<table align="center"><tr><td align="right"><img src="exclamationmark.jpg" /><td>
<td align="left"><font size="+1">Not all evaluations are completed. You have 10 remaining.</font></td></tr></table>
<td>Select an evaluation form:</td>
<td><select name='eval_form' onchange='WhichForm(this.form)'><option>--- Select a form ---</option><option value='load'>Loader</option><option value='belt'>Belt Picker</option><option value='ic'>IC Loader</option></td>
</tr></table></p>
<!-- Loader section to hide/un-hide -->
<div id='load' style='display: none'><form action="insert.php?action=loader" method="post">
<table border="0">
<tr>
<td>some content</td>
</tr>
</table>
</form>
</div>
<!-- Loader section to hide/un-hide -->
<!-- Belt section to hide/un-hide -->
<div id='belt' style='display: none'><form action="insert.php?action=load_belt" method="post">
<table border="0">
<tr>
<td>some content again</td>
</tr>
</table>
</form>
</div>
<!-- Belt section to hide/un-hide -->
<!-- IC section to hide/un-hide -->
<div id='ic' style='display: none'><form action="insert.php?action=load_ic" method="post">
<table border="0">
<tr>
<td>some more content again</td>
</tr>
</table>
</form>
</div>
<!-- IC section to hide/un-hide -->
</body>
</html>