| joel45 |
01-30-2013 02:56 AM |
Calculating javascript | html form
I'm trying to calculate this form with quantities and addition, some fields have required amounts and the other fields are quantities and amounts for input. I am trying to add all of this together and apply tax. Any help would be much appreciated. Here is a link of the Excel spreadsheet I'm working from: Estimator Form
Here is the code of what I have so far:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Estimator</title>
</head>
<body bgcolor="#FFFFFF">
<h2></h2>
<br />
<table border="0" cellpadding="0" width="550" id="table2">
<tr>
<td width="250" height="31"><b>Item Description</b></td>
<td align="center" width="100" height="31"><b>Quantity</b></td>
<td align="right" height="31" width="60"><b></b></td>
<td align="right" height="31" width="140"><b>Total</b></td>
</tr>
<tr>
<td width="250">Truck & Fuel Surcharge</td>
<td align="center" width="100">
<input type="text" value="" name="qtyA" id="qtyA" size="5" tabindex="5"></td>
<td align="right" type="hidden" width="60">$65</td>
<td align="right" width="140">
<input readonly style="border:0px;" tabindex="99" name="totalA" id="totalA" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250">Contract Labor</td>
<td align="center" width="100">
<input type="text" name="qtyB" id="qtyB" size="5" tabindex="5" ></td>
<td align="right" type="hidden" width="60">$88</td>
<td align="right" width="140">
<input type="hidden" name="totalB" id="totalB" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250">Contract Labor OT</td>
<td align="center" width="100">
<input type="text" name="qtyC" id="qtyC" size="5" tabindex="5" ></td>
<td align="right" type="hidden" width="60">$132</td>
<td align="right" width="140">
<input type="hidden" name="totalC" id="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250">Non Contract Labor</td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" type="hidden" width="60">$98</td>
<td align="right" width="140">
<input type="hidden" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250">Non Contract Labor OT</td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" type="hidden" width="60">$147</td>
<td align="right" width="140">
<input type="hidden" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250"><b>Parts Description</b></td>
<td align="center" width="100">
<td align="right" width="140">
</td>
</tr>
<tr>
<td width="250">Compressor</td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250">Contactors</td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250">Oil Pressure Switch</td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250">Core Driers</td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td>
<input type="text" name="input1" size="25"></td></td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td>
<input type="text" name="input1" size="25"></td></td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td>
<input type="text" name="input1" size="25"></td></td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td>
<input type="text" name="input1" size="25"></td></td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td>
<input type="text" name="input1" size="25"></td></td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td>
<input type="text" name="input1" size="25"></td></td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td>
<input type="text" name="input1" size="25"></td></td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td>
<input type="text" name="input1" size="25"></td></td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td>
<input type="text" name="input1" size="25"></td></td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">$
<input type="text" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250">R 22</td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<tr>
<td width="250">Leak Check</td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140">
<input type="hidden" name="totalC" size="12" tabindex="99" ></td>
</tr>
<tr>
<td width="250">Recovery #</td>
<td align="center" width="100">
<input type="text" name="qtyC" size="5" tabindex="5" ></td>
<td align="right" width="60"></td>
<td align="right" width="140"> </td>
</tr>
<tr>
<td width="250"> </td>
<td align="center" width="100"> </td>
<td align="right" width="60"> </td>
<td align="right" width="140"> </td>
</tr>
<tr>
<td align="center" width="40"> </td>
<td align="right" width="60"> </td>
<td width="250">
<p align="right"><b>Tax:</b></td>
<td align="right" width="250">$
<input name="Tax" id="Tax" size="15" readonly style="border:0px;" tabindex="99"></td>
</tr>
<tr>
<td align="center" width="40"> </td>
<td align="right" width="60"> </td>
<td width="250">
<p align="right"><b>GRAND TOTAL:</b></td>
<td align="right" width="250">$
<input name="GrandTotal" id="GrandTotal" size="15" readonly style="border:0px;" tabindex="99"></td>
</tr>
<tr>
<td align="center" width="40"> </td>
<td align="right" width="60"> </td>
<td width="250">
<p align="right"><b>COMMISSION:</b></td>
<td align="right" width="250">$
<input type="text" name="Commission" id="Commission" size="15" tabindex="99" readonly style="border:0px;" tabindex="99"></td>
</tr>
<tr>
<td width="250"> </td>
<td align="center" width="100"> </td>
<td align="right" width="60"> </td>
<td align="right" width="140"> </td>
</tr>
</table>
</body>
<script type="text/javascript">
function bizAmt(amount)
{
string = "" + amount;
dec = string.length - string.indexOf('.');
if (string.indexOf('.') == -1)
return string + '.00';
if (dec == 1)
return string + '00';
if (dec == 2)
return string + '0';
if (dec > 3)
return string.substring(0,string.length-dec+3);
return string;
}
function calculate()
{
QtyA = 0; QtyB = 0; QtyC = 0;
TotA = 0; TotB = 0; TotC = 0;
PrcA = 65; PrcB = 88; PrcC = 132;
if (document.getElementById("qtyA").value > "")
{ QtyA = document.getElementById("qtyA").value };
document.getElementById("qtyA").value = eval(QtyA);
if (document.getElementById("qtyB").value > "")
{ QtyB = document.getElementById("qtyB").value };
document.getElementById("qtyB").value = eval(QtyB);
if (document.getElementById("qtyC").value > "")
{ QtyC = document.getElementById("qtyC").value };
document.getElementById("qtyC").value = eval(QtyC);
TotA = QtyA * PrcA;
document.getElementById("totalA").value = bizAmt(eval(TotA));
TotB = QtyB * PrcB;
document.getElementById("totalB").value = bizAmt(eval(TotB));
TotC = QtyC * PrcC;
document.getElementById("totalC").value = bizAmt(eval(TotC));
Totamt =
eval(TotA) +
eval(TotB) +
eval(TotC) ;
document.getElementById("GrandTotal").value = bizAmt(eval(Totamt));
}
function validNum(theForm)
{
var checkOK = "0123456789.,";
var checkStr = theForm.qtyA.value;
var allValid = true;
var validGroups = true;
var decPoints = 0;
var allNum = "";
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkOK.length; j++)
if (ch == checkOK.charAt(j))
break;
if (j == checkOK.length)
{
allValid = false;
break;
}
if (ch == ".")
{
allNum += ".";
decPoints++;
}
else if (ch == "," && decPoints != 0)
{
validGroups = false;
break;
}
else if (ch != ",")
allNum += ch;
}
if (!allValid)
{
alert("Please enter only digit characters in the \"Truck Fuel Charge quantity\" field.");
theForm.qtyA.focus();
return (false);
}
if (decPoints > 1 || !validGroups)
{
alert("Please enter a valid number in the \"Truck Fuel Charge quantity\" field.");
theForm.qtyA.focus();
return (false);
}
var checkOK = "0123456789.,";
var checkStr = theForm.qtyB.value;
var allValid = true;
var validGroups = true;
var decPoints = 0;
var allNum = "";
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkOK.length; j++)
if (ch == checkOK.charAt(j))
break;
if (j == checkOK.length)
{
allValid = false;
break;
}
if (ch == ".")
{
allNum += ".";
decPoints++;
}
else if (ch == "," && decPoints != 0)
{
validGroups = false;
break;
}
else if (ch != ",")
allNum += ch;
}
if (!allValid)
{
alert("Please enter only digit characters in the \"contract Labor quantity\" field.");
theForm.qtyB.focus();
return (false);
}
if (decPoints > 1 || !validGroups)
{
alert("Please enter a valid number in the \"contract Labor quantity\" field.");
theForm.qtyA.focus();
return (false);
}
var checkOK = "0123456789.,";
var checkStr = theForm.qtyC.value;
var allValid = true;
var validGroups = true;
var decPoints = 0;
var allNum = "";
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkOK.length; j++)
if (ch == checkOK.charAt(j))
break;
if (j == checkOK.length)
{
allValid = false;
break;
}
if (ch == ".")
{
allNum += ".";
decPoints++;
}
else if (ch == "," && decPoints != 0)
{
validGroups = false;
break;
}
else if (ch != ",")
allNum += ch;
}
if (!allValid)
{
alert("Please enter only digit characters in the \"contract Labor OT quantity\" field.");
theForm.qtyC.focus();
return (false);
}
if (decPoints > 1 || !validGroups)
{
alert("Please enter a valid number in the \"contract Labor OT quantity\" field.");
theForm.qtyC.focus();
return (false);
}
calculate();
return (true);
}
</script>
</html>
|
