Webmaster Forum Rules | Posting Guide | Contact Us | Testimonials | Contributing Geek Program | Advertise on Geek/Talk
Welcome to the GeekTalk Webmaster Discussion Forums from GeekVillage.com

Click Here To Register. It's Free!

Go Back   geek/talk: Signature-free discourse for serious web publishers > YOUR CREATION: Building & Maintaining A Web Site > Web Development - Programming / Coding
User Name
Password
Register FAQ Calendar Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 08-24-2004, 06:06 PM   #1
DougM
Registered User
 
Join Date: Sep 2003
Location: Texas
Posts: 663
Default HTML forms - calculate totals

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
DougM is offline   Reply With Quote
Old 08-24-2004, 06:34 PM   #2
Sashman
Registered User
 
Join Date: Aug 2002
Location: Dulles Virginia
Posts: 590
Default

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>
Sashman is offline   Reply With Quote
Old 08-24-2004, 07:40 PM   #3
AK
Registered User
 
AK's Avatar
 
Join Date: Jan 2000
Location: Lkpg, SE
Posts: 562
Default

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="">

...
AK is offline   Reply With Quote
Old 08-24-2004, 08:56 PM   #4
DougM
Registered User
 
Join Date: Sep 2003
Location: Texas
Posts: 663
Default

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>
can you see where I misplaced something?
DougM is offline   Reply With Quote
Old 08-24-2004, 09:41 PM   #5
AK
Registered User
 
AK's Avatar
 
Join Date: Jan 2000
Location: Lkpg, SE
Posts: 562
Default

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.
AK is offline   Reply With Quote
Reply

Bookmarks

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Forum Jump

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

Please support our advertisers. They ensure our survival.

All times are GMT -5. The time now is 02:01 PM.


GeekVillage.com is copyright © 1998-2013 iOnline Pty Ltd. All rights reserved.
Powered by vBulletin® Version 3.7.4
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.