Calculate input fields ... give total

Posted on 2004-11-22
Medium Priority
Last Modified: 2006-11-17
I have a dynamically generated form that's being called from the database using ASP.  The amount of rows is dependent upon how many entries exist in the database.  In this form people will enter a meter amount and then a total amount (It's a utility database).  What I want to happen is the total amount to be added to a running Total Amount for the page.  I know this has to be a javascript function but I don't know how to go about doing it.  I've included some of the code...

<form action="Enter.asp?Search=1" method="post" name="Step2">
<input type="hidden" value="<%= Property %>" name="Property">
<table width="90%" border="0" cellspacing="0" cellpadding="0" align="center">
      <td width="35%" valign="top" align="left" class="newstext"><% IF icount = 0 then %><b><%= objRS("Service Address") %></b><br><%= objRS2("Account Number") %><% Else %>&nbsp;<% End IF %></td>
      <td width="15%" align="center" class="normal"><%= objRS2("Meter Number") %></td>
      <td width="10%" align="center" class="normal">Gas</td>
      <td width="20%" align="center" class="normal"><input type="text" class="normal" name="Used<%= var %>" size="4" maxlength="4"></td>
      <td width="20%" align="center" class="normal">$<input type="text" class="normal" name="Total<%= var %>" size="6" maxlength="6"></td>
icount = icount + 1
icount = 0
var = var + 1
      <td width="100%" colspan="5" class="normal" align="center"><hr></td>

'  Lots more here ... blah blah blah

      <td width="15%" colspan="4" align="center" class="newstext"><b><%= Property %> Grand Total:</b></td>
      <td width="15%" align="center" class="newstext">$<input type="text" name="GrandTotal" class="normaltxt" size="5" maxlength="5" readonly></td>

How to I get the Grand Total column to add dynamically with each Total entry?

Question by:BSitko
  • 2
  • 2
LVL 31

Expert Comment

ID: 12647580
please post some sample generated html

Author Comment

ID: 12647604
Address Meter # Type Therm/Kwh Total
22024-00013                              N/A         Electric  $ _______
                                                503585     Gas       $ _______

09606-56017                             N/A          Electric    $______

72024-08014                             N/A          Electric    $______
                                                233236     Gas         $______


GRAND TOTAL                                                        $_________

Note the underlined areas are actually textboxes.
LVL 18

Accepted Solution

arantius earned 2000 total points
ID: 12647620
Online example: http://www.arantius.com/ee/Q_21216279.html

For this example, you must apply the ID attribute to all your total fields, from total1, total2, so on, and the ID of grandtotal to where you want the answer to go.  Then assign the onkeyup events to each of the total fields.

function updateTotal() {
      var el=true, total=0;
      for(var i=1; true; i++) {
            if (!el) break;
      var tot=document.getElementById("grandtotal");

<input id="total1" onkeyup="javascript:updateTotal();"><br>
<input id="total2" onkeyup="javascript:updateTotal();"><br>
<input id="total3" onkeyup="javascript:updateTotal();"><br>

<input id="grandtotal" readonly="readonly">


Author Comment

ID: 12647757
Some tweaks (the ID thing) and it works perfectly.  THANKS!
LVL 31

Expert Comment

ID: 12647876
BSitko , I meant the actual HTML that the ASP sends down to a page , run an example and post the HTML source of the page generated

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

A while back, I ran into a situation where I was trying to use the calculated columns feature in SharePoint 2013 to do some simple math using values in two lists. Between certain data types not being accessible, and also with trying to make a one to…
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

807 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question