Menu
I have included the form code I have been working on below: to illustrate the values that will appear in the form please use the following values:
A = 1000
B = 500
c = 3000
(A + ? / C = D
This is what I am trying to achieve:
If D >= 0.85 show form1 div
Else show form2 div
I was wondering if anybody can help me solve this or point me in the right direction as to how write the correct function to hide / show divs depending upon the value of a text field. Is this possible? Many thanks for your time.
bmc
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″ />
<title>Untitled Document</title>
<script language=”JavaScript” type=”text/JavaScript”>
function calculate() {
var valuea = parseInt(document.forms[‘form1’].elements[‘valuea’].value, 10);
var valueb = parseInt(document.forms[‘form1’].elements[‘valueb’].value, 10);
var valuec = parseInt(document.forms[‘form1’].elements[‘valuec’].value, 10);
var frm = document.forms[‘form1’].elements;
if (isNaN(valuea)) valuea = 0;
if (isNaN(valueb)) valueb = 0;
if (isNaN(valuec)) valuec = 0;
if (!isNaN(valuea) && !isNaN(valueb)) {
var tqVal = valuea + valueb;
frm[‘output’].value = tqVal;
var total = tqVal / valuec;
frm[‘total’].value = total;
}
return;
}
<style type=”text/css”>
<!–
#form1{ display: none;}
#form2{ display: none;}
–>
</style>
</head>
<body>
<form name=”form1″ id=”form1″ method=”post” action=””>
<table width=”100%” border=”0″ cellspacing=”0″ cellpadding=”0″>
<tr>
<td><div align=”center”><u><strong>Applicant 1 </strong></u></div></td>
<td> </td>
</tr>
<tr>
<td width=”15%”><div align=”right”>Value A </div></td>
<td width=”85%”><input name=”valuea” type=”text” id=”valuea” /></td>
</tr>
<tr>
<td><div align=”right”>Value B </div></td>
<td valign=”top”><input name=”valueb” type=”text” id=”valueb” /></td>
</tr>
<tr>
<td><div align=”right”>Value C </div></td>
<td valign=”top”><input name=”valuec” type=”text” id=”valuec” /></td>
</tr>
<tr>
<td> </td>
<td valign=”top”> </td>
</tr>
<tr>
<td><div align=”right”>Total:</div></td>
<td valign=”top”><input name=”output” type=”text” id=”output” /></td>
</tr>
<tr>
<td><div align=”right”>Total:</div></td>
<td valign=”top”><input name=”total” type=”text” id=”total”/></td>
</tr>
<tr>
<td>
<input type=”button” onclick=”calculate();” name=”Submit” value=”Submit” />
</div></td>
<td valign=”top”> </td>
</tr>
</table>
<p> </p>
<p></p>
</form>
</body>
</html>
I have used the following function to show / hide divs depending upon a select option before but I am not sure how to use this to show / hide divs depending upon the value of a text field. Any help or advice would be greatly appreciated.
function addOptions(_obj) {
if (
document.getElementById(‘test2’).style.display = ‘block’;
}
else {
document.getElementById(‘test2’).style.display = ‘none’;
}
}