Mini Calculator [Archive] - CodingForums.com

Dingbat

04-12-2004, 11:57 PM

Hi Guys,

I am looking for a script that will work as a mini calculator. Something along these lines.

Qty
<input type="text" name="textfield">
<br>
Cost
<input type="text" name="textfield3">
<br>
Sub Total
<input type="text" name="textfield2">
<br>
Vat
<input type="text" name="textfield4">
<br>
Total
<input type="text" name="textfield5">

Also with the possibility of another field to allow for discount.

Any assistance with a script or to point me in the right direction will be greatly appreciated.

The Dingbat. :o

shlagish

04-13-2004, 01:29 AM

first, use id instead of name.
second, you can access these feilds with document.getElementById("textfeild");
so you operate on:
document.getElementById("textfeild").value;
once the operation is done and the result is stored in a variable:
document.getElementById("textfeild5").value=varname;

Is that good enough pointers for now?

glenngv

04-13-2004, 06:19 AM

<html>
<head>
<script type="text/javascript">
function compute(f){
if (isNaN(Number(f.qty.value))){
f.qty.value='0';
}
else if (isNaN(Number(f.cost.value))){
f.cost.value='0';
}
else if (isNaN(Number(f.vat.value))){
f.vat.value='0';
}
var sub = f.qty.value*f.cost.value;
f.subtotal.value=sub;
f.total.value=sub + ((f.vat.value/100)*sub);
}
</script>
</head>
<body>
<form>
Qty
<input type="text" name="qty" onchange="compute(this.form)" />
<br>
Cost
<input type="text" name="cost" onchange="compute(this.form)" />
<br>
Sub Total
<input type="text" name="subtotal" readonly="readonly" />
<br>
Vat (%)
<input type="text" name="vat" onchange="compute(this.form)" />
<br>
Total
<input type="text" name="total" readonly="readonly" />
</form>
</body>
</html>

Dingbat

04-13-2004, 08:25 AM

Hi Glenn,

Thank you for your script, it did of course work as you would expect. However can I be a bore and ask for a small change.

In the VAT field can it show the VAT amount instead of the % rate.

I am looking for the user to enter only two (2) amounts, the Qty & the cost and for the form then to show the sub total, the vat amount and then the final total to be calculated to two (2) decimal places.

I do hope that what I am asking for is only a small change.

Kind regards,

Dingbat

shlagish

04-13-2004, 10:11 PM

what's VAT?

Willy Duitt

04-13-2004, 10:14 PM

what's VAT?

Vat is equivelent to tax

shlagish

04-13-2004, 10:21 PM

<html>
<head>
<script type="text/javascript">
function compute(f){
if (isNaN(Number(f.qty.value))){
f.qty.value='0';
}
else if (isNaN(Number(f.cost.value))){
f.cost.value='0';
}
var TAX=15 //enter the percentage that represents tax
var sub = f.qty.value*f.cost.value;
f.subtotal.value=sub;
f.vat.value=subtotal*TAX/100;
f.total.value=sub + ((f.vat.value/100)*sub);
}
</script>
</head>
<body>
<form>
Qty
<input type="text" name="qty" onchange="compute(this.form)" />
<br>
Cost
<input type="text" name="cost" onchange="compute(this.form)" />
<br>
Sub Total
<input type="text" name="subtotal" readonly="readonly" />
<br>
Vat
<input type="text" name="vat" readonly="readonly" />
<br>
Total
<input type="text" name="total" readonly="readonly" />
</form>
</body>
</html>

glenngv

04-14-2004, 01:45 AM

what's VAT?
Exactly means Value Added Tax

Dingbat, there's a script in Javascript FAQ sticky that shows numbers in 2 decimal places.

Dingbat

04-14-2004, 02:07 PM

Hi Guys,

I know that someone will be able to help me with this problem. In the attached file is the code that I am trying to use to show a small calculation form. It works to a point and I can use if it cant be amended.
I have been trying to amend the script that Glenn very kindly made for me but without success, (not very javascript literate and getting to old to see the problems)

What I seek to achieve is to show the VAT amount not the %rate and also to have the final total display to two (2) decimal places.

Any assistance will be greatly appreciated.

Regards,

The Dingbat

Dingbat

04-15-2004, 05:40 PM

Any assistance will be greatly apprecated. :o :o

The Dingbat :o :confused:

shlagish

04-15-2004, 10:12 PM

I don't get it, VAT is a number?
I thought VAT was indeed a percentage of the price..
If you tell me what VAT is exactly I will probably be able to help you

Dingbat

04-16-2004, 08:35 AM

Hi Shlagish,

Thanks for your response. You are correct with VAT. If I may explain a little further. VAT is Value Added Tax that is applied in the UK. It is 17.5% added to the sub total of a sale.

My objective is to show the value of vat and then to add the vat value to the sub total to finally show the total sales value.

With the script that Glenn made for me I can make the VAT field in the form hidden and give it a value of 17.5 and that very nearly does what I want but I would prefer if it is possible to show what is the value as described above.

I hope you can assist.

Regards,

The Dingbat

shlagish

04-16-2004, 10:33 PM

Here you go:

<html>
<head>
<script type="text/javascript">
function compute(f){
if (isNaN(Number(f.qty.value))){
f.qty.value='0';
}
else if (isNaN(Number(f.cost.value))){
f.cost.value='0';
}

var sub = f.qty.value*f.cost.value;
f.subtotal.value=sub;
f.vat.value=sub*17.5/100;
f.total.value=sub + parseInt(f.vat.value,10);
}
</script>

<link rel="stylesheet" type="text/css" href="../Fence.css">
</head>
<body>
<form>
<p align="center"><img border="0" src="../images/owl.gif" width="56" height="73"></p>
<p align="center">To calculate the cost of your needs<br>
Enter the number of items in the Qty
<br>
Enter the price of the item in the Price<br>
Then click in the sub total to calculate the full total</p>
<div align="center">
Show VAT amount (Not the % rate)<input type="text" name="vat" value="" onchange="" readonly="readonly" />

<table border="0" cellspacing="1" style="border-collapse: collapse" bordercolor="#111111" width="50%" id="AutoNumber1">
<tr>
<td width="74%" align="right">Qty  </td>
<td width="26%" align="right">
<input type="text" name="qty" onchange="compute(this.form)" size="11" /></td>
</tr>
<tr>
<td width="74%" align="right">Cost  </td>
<td width="26%" align="right">
<input type="text" name="cost" onchange="compute(this.form)" size="11" /></td>
</tr>
<tr>
<td width="74%" align="right">Sub Total  </td>
<td width="26%" align="right">
<input type="text" name="subtotal" readonly="readonly" size="11" /></td>
</tr>
<tr>
<td width="74%" align="right">Total inc VAT  </td>
<td width="26%" align="right">
<input type="text" name="total" readonly="readonly" size="11" /></td>
</tr>
</table>
<p>
<a href="javascript:window.close()">
<img border="0" src="../images/close_off.gif" width="125" height="22"></a></div>
<p>
<br>
<br>
<br>
 </p>
</form>
</body>
</html>

The key element here is:
f.vat.value=sub*17.5/100
simple? yes

Dingbat

04-17-2004, 06:54 PM

Hi Shlagish,

Nearly there. You show the VAT amout as I hoped but the final total does not show any decimal places.

Ihave tried changing several items but without success. I regret that I am a dumbo when it comes to this type of calculation.

Regards,

The Dingbat. :o :o

shlagish

04-19-2004, 12:57 AM

http://www.codingforums.com/showthread.php?p=178077#post178077

go see this, it should help :)

glenngv

04-19-2004, 02:38 AM

Exactly means Value Added Tax

Dingbat, there's a script in Javascript FAQ sticky that shows numbers in 2 decimal places.

Dingbat, I already told you where to find that script which shlagish also did, but you ignored it.

shlagish, why did you use parseInt in the VAT field? That will truncate the decimal values.

f.vat.value=sub*17.5/100;
f.total.value=sub + parseInt(f.vat.value,10);

To use the toDecimals() in the javascript FAQ, the code would look like this:

f.vat.value=sub*17.5/100;
f.total.value=(sub + parseFloat(f.vat.value)).toDecimals(2);

shlagish

04-19-2004, 02:41 AM

glenngv, the toDecimal is oblviously the best way to do it.
But in answer to your question, I don't remember why I used it, probably because it would give a huge number..