Need help with a auto calculating form

**sawebs** · 03-15-2012, 09:41 AM

The image below is the way my client needs the calculating form to work.

Every field has to be times the other field to get a total in the last
one, example:
Amount of days x Amount of taxis x Price per taxi per day x 100% minus '% off' contract A, B, C, D = TOTAL
22 x 50 x 15 x 0.93 = R 15,345.00

I am new to this, I have no idea how to work a round this.

Any help will be appreciated.

**keyboard** · 03-15-2012, 10:57 AM

The code itself is very simple.
You simply get the elements by id (getElementByID) assign each of them to a variable (var inputOne = document.getElementByID('id');) and so on then, times the variables together - var answer = inputOne * inputTwo and so on.

Could you please post the html code for the image you showed us so we can show you how to make this work with the code you already have.

Keyboard1333

**sawebs** · 03-15-2012, 11:48 AM

I cant find any code that works in that manner, that's when I desided to post my problem here.

My knowledge with JavaScript is limited.

The only code that I ever designed was a price calculator and it took me two weeks to figure out. And it was two years ago

This is the script:
[CODE]
<script language="JavaScript"></script>
[CODE]

**keyboard** · 03-16-2012, 12:57 AM

If your trying to times the contents of 4 inputs together then output the answer, this will work.

Code:

<html>
<head>
<script type="text/javascript">
function calculate() {
var numericExpression = /^[0-9]+$/;
var field1 = document.getElementById('el1').value;
var field2 = document.getElementById('el2').value;
var field3 = document.getElementById('el3').value;
var field4 = document.getElementById('el4').value;
var check = "true";
if(!field1.match(numericExpression)){
var check = "false";
}
if(!field2.match(numericExpression)){
var check = "false";
}
if(!field3.match(numericExpression)){
var check = "false";
}
if(!field4.match(numericExpression)){
var check = "false";
}
if(check == "false") {
alert("Please enter only numbers");
return;
}
var total = field1 * field2 * field3 * field4;
document.getElementById('calculate').innerHTML = "Total: " + total;
}
</script>
</head>
<body>
<form>
<input type="text" id="el1" style="float:left;" value="Amount of days">
<input type="text" id="el2" style="float:left;" value="Amount of taxis">
<input type="text" id="el3" style="float:left;" value="Price per taxi per day">
<input type="text" id="el4" style="float:left;" value="100% minus % off">
<div id="calculate" style="margin-left:5px;sheight:23px;width:100px;float:left;">Total:</div>
<br />
<br />
<input type="button" value="Calculate" onclick="calculate()">
</form>
</body>
</html>

Is that what you're trying to do?

**sawebs** · 03-19-2012, 06:42 AM

Sorry about the late reply our internet went down over the weekend.

Thank you ferry much for the assistance, you saved me a lot of work and research.

**keyboard** · 03-19-2012, 09:10 PM

You're welcome!

If this thread is finished, please set it to resolved.
You can do this by editing your first post within the thread - Pressing go advanced - then where it says no prefix, selecting resolved then save.

**sawebs** · 03-22-2012, 06:53 AM

Hi Keyboard1333

Sorry to be such a pain my client is requesting the following, the code work grate on the website.

In the field '100% minus % off' of the calculator it has to be able to calculate numbers under one, such as 0.93. Than it is calculating the total minus the discount.

**keyboard** · 03-22-2012, 07:01 AM

The only thing that's stopping you from entering a decimal into the 4th field is the validation. All you have to do is tell it to allow dots (.) in the fourth field

Code:

<html>
<head>
<script type="text/javascript">
function calculate() {
var numericExpression = /^[0-9]+$/;
var numericExpression2 = /^[0-9\.]+$/;
var field1 = document.getElementById('el1').value;
var field2 = document.getElementById('el2').value;
var field3 = document.getElementById('el3').value;
var field4 = document.getElementById('el4').value;
var check = "true";
if(!field1.match(numericExpression)){
var check = "false";
}
if(!field2.match(numericExpression)){
var check = "false";
}
if(!field3.match(numericExpression)){
var check = "false";
}
if(!field4.match(numericExpression2)){
var check = "false";
}
if(check == "false") {
alert("Please enter only numbers");
return;
}
var total = field1 * field2 * field3 * field4;
document.getElementById('calculate').innerHTML = "Total: " + total;
}
</script>
</head>
<body>
<form>
<input type="text" id="el1" style="float:left;" value="Amount of days">
<input type="text" id="el2" style="float:left;" value="Amount of taxis">
<input type="text" id="el3" style="float:left;" value="Price per taxi per day">
<input type="text" id="el4" style="float:left;" value="100% minus % off">
<div id="calculate" style="margin-left:5px;sheight:23px;width:100px;float:left;">Total:</div>
<br />
<br />
<input type="button" value="Calculate" onclick="calculate()">
</form>
</body>
</html>

**sawebs** · 04-03-2012, 06:02 AM

Sorry about the late reply they have been putting optical fiber cabling into our building.

The form needs to do the following?

Subtract that from 100 and type the result in the percentage box.
MUST BE: Subtract that from 100 % (example outcome: 0.93) and type
that result in the percentage box.

Current result is: 22 x 50 x 15 -10% Total: 165000
I need it to calculate in this manner: 22 x 50 x 15 -10% Total: 14850

Thanks for all your help.

Thread: Need help with a auto calculating form

Thread Tools

Search Thread

Need help with a auto calculating form

Bookmarks

Bookmarks

Posting Permissions