Question : onClick toggle function

Hello,

I have a hidden field in a form


<input name="amount" type="hidden" id="amount" value="25">

This is a form that calculates the total of products.

The initial value is 25, and in the form I have 2 checkboxes.

2checkboxes are addons to the main product and lets say first check box represent a add-on worth 35 , and second 50.

So what I want is,
When checking the first checkbox the hidden field (#amount) get updated. means if user check the box 35 add to the hidden fields value if removed subtract.

same goes for the 2nd check box.

Answer : onClick toggle function

test page :

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<input name="amount" type="text" id="amount" value="25"><br />
<input type="checkbox" value="35" onclick="document.getElementById('amount').value = parseInt(document.getElementById('amount').value) + (this.value *  (this.checked?1:-1))" />35<br />
<input type="checkbox" value="50" onclick="document.getElementById('amount').value = parseInt(document.getElementById('amount').value) + (this.value *  (this.checked?1:-1))" />50<br />
</body>
</html>
Random Solutions  
 
programming4us programming4us