|
I would like to use a dropdown list that would execute a different javascript funtion based on the value the user selected.
My first goal is if 1,2,3,4,or 5 is chosen the second field(named "Eway") appears. If 0 is chosen the field disappears.
My second goal is if the 2nd field is visable it needs to be required, when it is not visible it should NOT be required.
Here is what I've got so far...
<SCRIPT>
function yes() {
MMDiv.style.visibility='visible';
mainform.MakeModel.focus();
}</SCRIPT>
<SCRIPT>
function no() {
MMDiv.style.visibility='hidden';
mainform.MakeModel.focus();
}</SCRIPT>
<table width="292" align=center cellpadding=0 cellspacing=1 bgcolor=A4C0DD border=1><tr><td colspan="8">
<table border="0" align="center"><tr>
<td height=10 width="50"><B>Card 1</td>
<td>Qty
<select class=d type=text name=qty1 size=1 onchange="yes()">
<option selected value="0"></option>
<option onchange=yes() value="1">1 box of 250</option>
<option value="2">2 boxes of 250</option>
<option value="3">3 boxes of 250</option>
<option value="4">4 boxes of 250</option>
<option value="5">5 boxes of 250</option>
</td>
<td>
<DIV ID="MMDiv" style="visibility:hidden">
<LABEL FOR="MakeModel">Eway # <INPUT TYPE="TEXT" class="d" ID="MakeModel" name="requiredeway1" size="6">
</LABEL>
</DIV>
</td>
</tr></table>
</td></tr></table>
|
|
|
Here you go. Copy & Paste this into a new HTML document to test.
<SCRIPT language=javascript>
function toggleElement(e) {
e = document.getElementById(e);
if (form1.qty1.value == 0) {
e.style.visibility='hidden';
} else {
e.style.visibility='visible';
form1.MakeModel.focus();
}
}
function SubmitTrigger()
{
if (form1.qty1.value > 0) {
if (!form1.MakeModel.value) {
alert("Eway # is required");
return false;
}
}
return true;
}
function LoadTrigger() {
toggleElement('divMakeModel');
}
window.onload = LoadTrigger;
</SCRIPT>
<table width="292" align=center cellpadding=0 cellspacing=1 bgcolor=A4C0DD border=1><tr><td colspan="8">
<form name=form1 onsubmit="return SubmitTrigger();">
<table border="0" align="center"><tr>
<td height=10 width="50"><B>Card 1</td>
<td>Qty
<select class=d type=text name=qty1 size=1 onchange="toggleElement('divMakeModel')">
<option selected value="0">Select an option</option>
<option value="1">1 box of 250</option>
<option value="2">2 boxes of 250</option>
<option value="3">3 boxes of 250</option>
<option value="4">4 boxes of 250</option>
<option value="5">5 boxes of 250</option>
</td>
<td>
<div id="divMakeModel">
Eway # <INPUT TYPE="TEXT" ID="MakeModel" name="MakeModel" size="6">
</div>
</td>
<td>
<br>
<input type=submit value="go">
</td>
</tr></table>
</form>
</td></tr></table>
|
|
|
|
|
|
|
|
|
|
|
|