Script to Add and Count Values

[Yellowbird]

Hi all,

I'm new to JavaScript, but am pretty sure what I want to accomplish is
not that difficult. I just need an example or suggestion to help
clarify it for me - I haven't had much time to learn JS, so I have
been using some prebuilt scripts where needed.

I have a Web page form where a user can enter data. The first step is
for them to select a dropdown menu to indicate the number of entries
they will be making (the dropdown menu provides options of 5, 10, 25,
50, and 100). They may or may not actually enter that number (in other
words, they may choose 5 and only enter 2, so there would be 3 blank
rows). This then gives them a series of blank text boxes and they
enter the appropriate information (first name, last name, SSN, hours,
wages), such as:

Tim Jones 123-45-6789 40.0 1,275.00
Bob Stark 345-67-8901 32.0 1,002.75
(blank)
(blank)
(blank)
---------- ---- --------
Totals: 2 72.0 2,277.75

At the bottom of the form is a row where I'd like to provide totals
(dynamically) as they enter data. The first total would be the # of
names entered, the second total would be hours, and the third total
would be wages.

I need a script that will count the number of rows in the text column
(with data only) and add the values in the numeric columns, changing
the value in the Totals row as entries are made (or removed).

Any examples or suggestions are greatly appreciated.

TIA,
Yellowbird

[kaeli]

In article <63**************************@posting.google.com >,
ye*************@hotmail.com enlightened us with...

I need a script that will count the number of rows in the text column
(with data only) and add the values in the numeric columns, changing
the value in the Totals row as entries are made (or removed).

Any examples or suggestions are greatly appreciated.

The best way to do this is to name all the boxes you want in the total
with a particular name, then loop through the form when the element
changes and get the total of the ones that have numbers in them.

For example, you name all the boxes you want in the total with "T_" and
NO other elements have that in the name.
So you have
T_1
T_2
T_3
T_4
T_5
....
and so on.

Each one of these has an onChange that calls a function, call it
getTotals() or something.
<input type="text" name="T_1" onChange="getTotals()">

I'll assume the form is named form1 for convenience.
I'll assume the total element where you want it written is named
"total".
(watch for word-wrap)

function getTotals()
{
var total = 0;
var L = document.forms["form1"].elements.length;
for (var i=0; i<L; i++)
{
if (document.forms["form1"].elements[i].name.indexOf("T_") -1 && !isNaN(document.forms["form1"].elements[i].value))

{
total += parseFloat(document.forms["form1"].elements
[i].value);
}
}
document.forms["form1"].elements["total"].value = total;
return;
}

I didn't test this, so there may be a typo. It's early. :)

--
--
~kaeli~
She was engaged to a boyfriend with a wooden leg but broke
it off.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

[Yellowbird]

Thanks, Kaeli. I think I get the gist of it, although I still have
some work to do. This sort of works on my non-numeric first column
(where I am simply counting the number of rows with text entered), but
the total field of the non-numeric column displays a 0 (zero), so it
doesn't really sum things up. When I tried this on my numeric column,
the numeric column total fields (hours total and wages total) display
"NaN", which doesn't make sense since the value in this field is a
number. I think I need a way to total the non-numeric column and the
numeric columns using the same script. However, if I go with the "T_"
naming convention, I get erratic results. Do I need individual scripts
for each column I want to total? I guess eventually I will also need
to add some validation to check for non-numeric values in my numeric
column (and vice versa).

Again, thanks for any suggestions or guidance,
Yellowbird

[kaeli]

In article <63**************************@posting.google.com >,
ye*************@hotmail.com enlightened us with...

Thanks, Kaeli. I think I get the gist of it, although I still have
some work to do. This sort of works on my non-numeric first column
A total will not work if the value is not a number. This script assumes
all values are numeric in the T_ inputs. It will not sum non-numerics.
(where I am simply counting the number of rows with text entered), but
the total field of the non-numeric column displays a 0 (zero), so it
doesn't really sum things up. When I tried this on my numeric column,
the numeric column total fields (hours total and wages total) display
"NaN", which doesn't make sense since the value in this field is a
number.
How are they formatted?
Is there a dollar sign or a period?
I think I need a way to total the non-numeric column and the
numeric columns using the same script.

You can't sum a non-numeric. Letters and symbols aren't numbers.

If you have a URL, that would be helpful...

--
--
~kaeli~
Dijon vu - the same mustard as before.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

[Yellowbird]

kaeli <ti******@NOSPAM.comcast.net> wrote in message news:<MP************************@nntp.lucent.com>. ..

A total will not work if the value is not a number. This script assumes
all values are numeric in the T_ inputs. It will not sum non-numerics.

I realized that after I started working with it. I've actually come up
with a new concept for this part of the form. Originally I had the
user select a radio button to indicate the number of rows to complete
and then I displayed that number for them to complete. Now I'm
thinking that it might be better if I can have one part of the form
with a single row where they enter data, then click a button to add it
to the "master list" at the bottom of the form. They'd have to do that
every time they wanted to add something to the list, and would receive
a confirmation before they submit - at this point they can edit or
delete the entries in the list. I can then capture the total number of
rows in a different manner.

When I tried this on my numeric column,
the numeric column total fields (hours total and wages total) display
"NaN", which doesn't make sense since the value in this field is a
number.

How are they formatted?
Is there a dollar sign or a period?

I have them formatted as decimals with the explicit period,
right-justified (so, for example, if they enter 40 hours, the value is
formatted as 40.0 and if they enter 1250 for wages, it is formatted
1250.00).

Once I've gotten a little further with this, I'll post an example and
probably ask the group for some additional feedback/suggestions.

Thanks again,
Yellowbird

[kaeli]

In article <63**************************@posting.google.com >,
ye*************@hotmail.com enlightened us with...

I can then capture the total number of
rows in a different manner.

Why do you need the total rows? I can't see a reason for it. You don't
need it for a total if they have the right naming convention.
I have them formatted as decimals with the explicit period,
right-justified (so, for example, if they enter 40 hours, the value is
formatted as 40.0 and if they enter 1250 for wages, it is formatted
1250.00).

ParseFloat should work fine then...
Once I've gotten a little further with this, I'll post an example and
probably ask the group for some additional feedback/suggestions.

That would help us know why you're getting NaN.
The only thing I can think of is that you're grabbing a non-numeric
field and trying to total it. Periods are allowed in float, so there is
something else going on here.

--
--
~kaeli~
A backward poet writes... inverse.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace