| Webmaster Forum Rules | Posting Guide | Contact Us | Testimonials | Contributing Geek Program | Advertise on Geek/Talk |
|
|
|||||||
![]() |
|
|
Thread Tools | Display Modes |
|
|
#1 |
|
Registered User
Join Date: Sep 2003
Location: Texas
Posts: 663
|
I would like to build an HTML form which calculates totals from selected check boxes like this.
Can anyone point me in the right direction. Google has failed me so far. I have found similar topics but none get me where I need to be. Is this possible? Thanks |
|
|
|
|
|
#2 |
|
Registered User
Join Date: Aug 2002
Location: Dulles Virginia
Posts: 590
|
Yes, you can do this very easily. Read up on DHTML and input object / form fields.
From the top of my head ---> <script> val=0; function updatefield() { document.form[0].total.value = val; ** </script> <input type="checkbox" onclick="if (this.checked) val=val+25 else val=val-25; updatefield();"> <input name="total" value=0> |
|
|
|
|
|
#3 |
|
Registered User
Join Date: Jan 2000
Location: Lkpg, SE
Posts: 562
|
This is another example, that calculates the total everytime someone clicks on a checkbox.
Code:
...
<script type="text/javascript">
<!--
function calculate_total() {
var total = 0;
var fe = document.forms[0].elements;
for(var i = 0; i < fe.length; i++) {
if (fe[i].checked) {
total += parseFloat(fe[i].value);
**
**
fe.T1.value = "$" + total.toFixed(2);
**
//-->
</script>
...
<body onload="calculate_total()">
...
<p>Option #1 - $5.40<input type="checkbox" name="C1" value="5.40" checked onclick="calculate_total()"></p>
<p>Option #2 - $10.00<input type="checkbox" name="C2" value="10" checked onclick="calculate_total()"></p>
...
<input type="text" name="T1" size="20" readonly="true" value="">
...
|
|
|
|
|
|
#4 |
|
Registered User
Join Date: Sep 2003
Location: Texas
Posts: 663
|
I tried that code but I must have something wrong. Maybe the wrongs parts in the head or body. This is the entire page I published as a test:
Code:
<html>
<head>
<script type="text/javascript">
<!--
function calculate_total() {
var total = 0;
var fe = document.forms[0].elements;
for(var i = 0; i < fe.length; i++) {
if (fe[i].checked) {
total += parseFloat(fe[i].value);
**
**
fe.T1.value = "$" + total.toFixed(2);
**
//-->
</script>
</head>
<body>
<body onload="calculate_total()">
<p>Option #1 - $5.40<input type="checkbox" name="C1" value="5.40" checked onclick="calculate_total()"></p>
<p>Option #2 - $10.00<input type="checkbox" name="C2" value="10" checked onclick="calculate_total()"></p>
<input type="text" name="T1" size="20" readonly="true" value="">
</body>
</html>
|
|
|
|
|
|
#5 |
|
Registered User
Join Date: Jan 2000
Location: Lkpg, SE
Posts: 562
|
Your input tags need to be inside a form for the script to work. Just use the code on this page, put the script between the head tags and update the rest of the code (i.e. the body tag and the input tags) as indicated and it should work.
Last edited by AK; 08-24-2004 at 09:50 PM. |
|
|
|
![]() |
| Bookmarks |
| Thread Tools | |
| Display Modes | |
|
|
Similar Threads
|
||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| Attach files to HTML forms | DougM | Web Development - Programming / Coding | 10 | 11-20-2004 06:25 PM |
| How to post 2 html forms in 1 click? | Blubster | Web Design and Webmaster Issues | 0 | 03-07-2002 03:01 PM |
| New supertaf forms | funpage | Making Money with CPC and/or CPM Programs | 5 | 08-08-2001 04:44 PM |
| Is HTML only in English? | DJ_B | Web Design and Webmaster Issues | 13 | 08-13-2000 11:32 PM |
| HTML editors | Questy | Web Design and Webmaster Issues | 35 | 06-30-1999 03:03 PM |
![]()