sbornstein2
asked on
Calculating Total on the Fly.
Hello all. I have actually a ASP.Net application where I have a grid that generates dynamically. In that grid there is a javascript call currently that checks to make sure a item entered is numeric. When the page loads initally I am going to have a count in a label that will say for example Qty = 150. Then the user can enter in values in textboxes in a column down my grid. There are multiple columns so I would have to based on where the textbox is entered somehow quickly take the total of the boxes entered and add that to the original label Qty total. So lets say the user goes down my grid and enters in a 4 in one box and then a 2 in another box. Each time I want to recalc the total so the first 4 it would go up to 156 then the second 2 it would go to 158. If they wipe out the 2 then back to 156. So I want to total the whole column and add that to my original value. How can I do this and somehow write that to my page label everytime? Thanks all
ASKER
here is the javascript currently:
<script language="javascript">
function keyCheck(eventObj, obj)
{
var keyCode
// Check For Browser Type
if (document.all){
keyCode=eventObj.keyCode
}
else{
keyCode=eventObj.which
}
var str=obj.value
if(keyCode<48 || keyCode >58) // Allow only integers
{
return false
}
return true
}
</script>
Here is the dynamic code generated from the grid again its dynamic through ASP.Net
<tr>
<td style="width:40px;">
<span id="dgResults__ctl180_Labe
</td><td style="width:90px;">
<span id="dgResults__ctl180_Labe
</td><td style="width:15px;">9</td>
<span id="dgResults__ctl180_Labe
</td><td style="width:15px;">IN</td
<span id="dgResults__ctl180_Labe
</td><td style="width:50px;">
<input name="dgResults:_ctl180:Gr
</td><td style="width:50px;">0</td>
<input name="dgResults:_ctl180:Gr
</td><td style="width:50px;">0</td>
</tr>
as you can see the input boxes now
<script language="javascript">
function keyCheck(eventObj, obj)
{
var keyCode
// Check For Browser Type
if (document.all){
keyCode=eventObj.keyCode
}
else{
keyCode=eventObj.which
}
var str=obj.value
if(keyCode<48 || keyCode >58) // Allow only integers
{
return false
}
return true
}
</script>
Here is the dynamic code generated from the grid again its dynamic through ASP.Net
<tr>
<td style="width:40px;">
<span id="dgResults__ctl180_Labe
</td><td style="width:90px;">
<span id="dgResults__ctl180_Labe
</td><td style="width:15px;">9</td>
<span id="dgResults__ctl180_Labe
</td><td style="width:15px;">IN</td
<span id="dgResults__ctl180_Labe
</td><td style="width:50px;">
<input name="dgResults:_ctl180:Gr
</td><td style="width:50px;">0</td>
<input name="dgResults:_ctl180:Gr
</td><td style="width:50px;">0</td>
</tr>
as you can see the input boxes now
You did not show the Label with the initial quantity.
Can you post the complette page.
Can you post the complette page.
ASKER
i did not create the label yet but it will be called lblTotalQty. It will just be a top row in the table and the label will exist. I cant post the whole html source because I am not at work to check the source its on the intranet.
<script language="javascript">
function DoTotal (theForm) {
var total= 0;
var elems = theForm.elements;
for (ix=0; ix < elems.length; ix++) {
if (elems[ix].name.match ('GridQuantity')) {
if (elems[ix].value.length) {
total += parseInt (elems[ix].value);
}
}
}
document.getElementById ('lblTotalQty').innerHTML = total;
}
function ValidateIntNumber(fld) {
if(fld.value.match(/[^0-9]
fld.value=fld.value.replac
}
}
</script>
<form>
<table id="table1">
<tr>
<td>Description</td>
<td>Quantity</td>
</tr>
<tr>
<td>Description 1</td>
<td><input type="text" onKeyUp="ValidateIntNumber
</tr>
<tr>
<td>Description 1</td>
<td><input type="text" onKeyUp="ValidateIntNumber
</tr>
<tr>
<td>Description 1</td>
<td><input type="text" onKeyUp="ValidateIntNumber
</tr>
</table>
</form>
Total is :<span id='totalQty'></span>
ASKER
pravinasar thanks sorry for the delay I did not see a new posting. I will try this. One question is there anyway to not loop almost like taking the qty in the label and then adding the delta the difference from what was in the box just in case they change the value and adding that to the total without looping.
ASKER
also one more thing is the lblTotalQty there can be up to a total of 5 columns so there is a label on the footer of each column called like lblTotalQty1, lblTotalQty2, lblTotalQty3, lblTotalQty4, lblTotalQty5. Then the boxes above each column. Thanks so much for all your help this is a tough one.
Here is a new solution which handles multi-column quantity fields.
About the incrementing only delta, I need to give a thought.
<html>
<head>
<title>Multi Column Qty Total</title>
</head>
<body>
<script language="javascript">
function DoTotal (theForm, theFld, lblId) {
var total= 0;
var elems = theForm.elements;
var lblObj = document.getElementById ('totalQty'+lblId);
for (ix=0; ix < elems.length; ix++) {
if (elems[ix].name.match ('GridQuantity'+lblId)) {
if (elems[ix].value.length) {
total += parseInt (elems[ix].value);
}
}
}
if (isNaN(total)) { total = 0; }
lblObj.innerHTML = total;
}
function ValidateIntNumber(fld) {
if(fld.value.match(/[^0-9]
fld.value=fld.value.replac
}
}
</script>
<form>
<table id="table1">
<tr>
<td>Description</td>
<td>Quantity 1</td>
<td>Quantity 2</td>
</tr>
<tr>
<td>Description 1</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Description 2</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Description 3</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Total</td>
<td>
<span id='totalQty1'></span>
</td>
<td>
<span id='totalQty2'></span>
</td>
</tr>
</table>
</form>
</body>
</html>
About the incrementing only delta, I need to give a thought.
<html>
<head>
<title>Multi Column Qty Total</title>
</head>
<body>
<script language="javascript">
function DoTotal (theForm, theFld, lblId) {
var total= 0;
var elems = theForm.elements;
var lblObj = document.getElementById ('totalQty'+lblId);
for (ix=0; ix < elems.length; ix++) {
if (elems[ix].name.match ('GridQuantity'+lblId)) {
if (elems[ix].value.length) {
total += parseInt (elems[ix].value);
}
}
}
if (isNaN(total)) { total = 0; }
lblObj.innerHTML = total;
}
function ValidateIntNumber(fld) {
if(fld.value.match(/[^0-9]
fld.value=fld.value.replac
}
}
</script>
<form>
<table id="table1">
<tr>
<td>Description</td>
<td>Quantity 1</td>
<td>Quantity 2</td>
</tr>
<tr>
<td>Description 1</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Description 2</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Description 3</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Total</td>
<td>
<span id='totalQty1'></span>
</td>
<td>
<span id='totalQty2'></span>
</td>
</tr>
</table>
</form>
</body>
</html>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
pravin thanks so much this is such a huge help I am going to try implementing this now. Just one question I have a total of 5 Qty Columns in total so do I have to add anything to what you have here. So there will be 5 Qty Total Columns with the textboxes running down the columns. Let me paste that code so you can see.
Here is the HTML Source this right here is only 2 products were selected but there can be a maximum of 5 selected.
<table cellspacing="0" cellpadding="0" rules="all" border="1" id="dgResults" style="width:730px;border-
<tr class="AllocateDataGridHea
<td><a href="javascript:__doPostB
</tr><tr class="AllocateDataGridIte
<td style="width:40px;">
<span id="dgResults__ctl3_Label3
</td><td style="width:90px;">
<span id="dgResults__ctl3_Label7
</td><td style="width:15px;">18</td
<span id="dgResults__ctl3_Label4
</td><td style="width:15px;">IN</td
<span id="dgResults__ctl3_Label5
</td><td style="width:50px;">
<input name="dgResults:_ctl3:Grid
</td><td style="width:50px;">0</td>
<input name="dgResults:_ctl3:Grid
</td><td style="width:50px;">0</td>
</tr><tr class="AllocateDataGridIte
<td style="width:40px;">
<span id="dgResults__ctl4_Label3
</td><td style="width:90px;">
<span id="dgResults__ctl4_Label7
</td><td style="width:15px;">8</td>
<span id="dgResults__ctl4_Label4
</td><td style="width:15px;">IN</td
<span id="dgResults__ctl4_Label5
</td><td style="width:50px;">
<input name="dgResults:_ctl4:Grid
</td><td style="width:50px;">0</td>
<input name="dgResults:_ctl4:Grid
</td><td style="width:50px;">0</td>
</tr><tr class="AllocateDataGridIte
<td> </td><td> <
<span id="dgResults__ctl5_lblGra
<span id="dgResults__ctl5_lblGra
</td><td>
<span id="dgResults__ctl5_lblTot
<span id="dgResults__ctl5_lblTot
</td><td> </td><td>
<span id="dgResults__ctl5_lblTot
<span id="dgResults__ctl5_lblTot
</td><td> </td>
</tr>
</table>
THE TOTAL ALLOCATED is the Qty I will want to Update adding the delta from the textboxes for that column. Such as lblTotalAllocated1 will need to add the delta of all the GridQuantity1 boxes. I hope this makes a little more sense.
Here is the HTML Source this right here is only 2 products were selected but there can be a maximum of 5 selected.
<table cellspacing="0" cellpadding="0" rules="all" border="1" id="dgResults" style="width:730px;border-
<tr class="AllocateDataGridHea
<td><a href="javascript:__doPostB
</tr><tr class="AllocateDataGridIte
<td style="width:40px;">
<span id="dgResults__ctl3_Label3
</td><td style="width:90px;">
<span id="dgResults__ctl3_Label7
</td><td style="width:15px;">18</td
<span id="dgResults__ctl3_Label4
</td><td style="width:15px;">IN</td
<span id="dgResults__ctl3_Label5
</td><td style="width:50px;">
<input name="dgResults:_ctl3:Grid
</td><td style="width:50px;">0</td>
<input name="dgResults:_ctl3:Grid
</td><td style="width:50px;">0</td>
</tr><tr class="AllocateDataGridIte
<td style="width:40px;">
<span id="dgResults__ctl4_Label3
</td><td style="width:90px;">
<span id="dgResults__ctl4_Label7
</td><td style="width:15px;">8</td>
<span id="dgResults__ctl4_Label4
</td><td style="width:15px;">IN</td
<span id="dgResults__ctl4_Label5
</td><td style="width:50px;">
<input name="dgResults:_ctl4:Grid
</td><td style="width:50px;">0</td>
<input name="dgResults:_ctl4:Grid
</td><td style="width:50px;">0</td>
</tr><tr class="AllocateDataGridIte
<td> </td><td> <
<span id="dgResults__ctl5_lblGra
<span id="dgResults__ctl5_lblGra
</td><td>
<span id="dgResults__ctl5_lblTot
<span id="dgResults__ctl5_lblTot
</td><td> </td><td>
<span id="dgResults__ctl5_lblTot
<span id="dgResults__ctl5_lblTot
</td><td> </td>
</tr>
</table>
THE TOTAL ALLOCATED is the Qty I will want to Update adding the delta from the textboxes for that column. Such as lblTotalAllocated1 will need to add the delta of all the GridQuantity1 boxes. I hope this makes a little more sense.
ASKER
actually I see what your doing here I will try this now
ASKER
it looks like I will have to do a match because it appends that front text to the total labels as well
ASKER
I added not sure if this is correct:
var lblObj = elems[0].name.match ('lblTotalAllocated'+lblId
but then I got an error in status window Do All elems[ix].name.match. It says 'null' is null or not an object
var lblObj = elems[0].name.match ('lblTotalAllocated'+lblId
but then I got an error in status window Do All elems[ix].name.match. It says 'null' is null or not an object
ASKER
forget that last post somehow that script was not your last script not sure what I copied.
ASKER
so I think the null is just I am doing the elem match wrong for the lblTotalAllocated
Just checking, do you need further help understanding my code..
ASKER
I am just trying to get that last piece.
var lblObj = document.getElementById ('totalQty'+lblId);
that also appends text to the front of it like the other controls even though it only is one control it looks like the render of the HTML adds text to the front. Can I do a match on this instead of getElementById?
var lblObj = document.getElementById ('totalQty'+lblId);
that also appends text to the front of it like the other controls even though it only is one control it looks like the render of the HTML adds text to the front. Can I do a match on this instead of getElementById?
You have label with id prefix..
dgResults__ctl5_lblTotalAl
Let me ask a few things.
1. What is schema for iput field names and labels ids
I see you have input field names
dgResults:_ctl3:GridQuanti
dgResults:_ctl4:GridQuanti
dgResults:_ctl3 does it mean a input field in third row ?
dgResults:_ctl4 does it mean a input field in foourth row ?
The labels ids are
dgResults__ctl5_lblTotalAl
dgResults__ctl5_lblTotalAl
Do you have flexibility on naming ?
Do the numbering of rows and columns (As I posted in example)
or
Another suggestion would be do it like spreadsheet
Columns (A, B, C,...) , Rows (1,2,3,....)
dgResults:_ctl3C:GridQuani
dgResults:_ctl4C:GridQuani
dgResults__ctl5C_lblTotalA
Based on the schema you adpot, we can finetune the function.
Thanks,
_PA
dgResults__ctl5_lblTotalAl
Let me ask a few things.
1. What is schema for iput field names and labels ids
I see you have input field names
dgResults:_ctl3:GridQuanti
dgResults:_ctl4:GridQuanti
dgResults:_ctl3 does it mean a input field in third row ?
dgResults:_ctl4 does it mean a input field in foourth row ?
The labels ids are
dgResults__ctl5_lblTotalAl
dgResults__ctl5_lblTotalAl
Do you have flexibility on naming ?
Do the numbering of rows and columns (As I posted in example)
or
Another suggestion would be do it like spreadsheet
Columns (A, B, C,...) , Rows (1,2,3,....)
dgResults:_ctl3C:GridQuani
dgResults:_ctl4C:GridQuani
dgResults__ctl5C_lblTotalA
Based on the schema you adpot, we can finetune the function.
Thanks,
_PA
ASKER
Hi there. What happens is in ASP.Net the grid has all these controls on it. So when the grid renders the HTML for each row it appends the new name like dgResults:_ctl3C:GridQuani
ASKER
I guess I could try creating a table with fixed widths and see if that works ok. I guess it would be much faster for the script to execute and not have to find the control is that correct?
ASKER
Actually that will be tough because in my code I am changing the width of the grid to handle setting the column widths to look correct so I might have to stick with it generating those controls like the textbox controls.
Instead of the span as a label you can use input fields as label (readonly)
<input type="text" readonly name="myTextOut1" style="border:none;">
will give you a flat text-out box
<input type="text" readonly name="myTextOut1" style="border:none;">
will give you a flat text-out box
ASKER
not sure if I can do that because in my code behind I do a find control and then apply the original amount I can try that though
ASKER
also the spans are created by the render of the HTML as well from the .Net page.
ASKER
I think I need to leave it as a control like it is. It runs on the Server and then I can set the initial such as:
<asp:label id="lblTotalAllocated1" runat="server"></asp:label
then in my code I set the initial value like:
Label lbl1Avail = (Label) e.Item.FindControl("lblTot
lbl1Avail.Text = cartProductQtyStr[0];
so what happens is I set the initial value I get from code. I guess the other thing I could do is something in the javascript to initially add all the values in the textboxes and set it in that way and try the way you are mentioning above for the textbox. What do you think.
<asp:label id="lblTotalAllocated1" runat="server"></asp:label
then in my code I set the initial value like:
Label lbl1Avail = (Label) e.Item.FindControl("lblTot
lbl1Avail.Text = cartProductQtyStr[0];
so what happens is I set the initial value I get from code. I guess the other thing I could do is something in the javascript to initially add all the values in the textboxes and set it in that way and try the way you are mentioning above for the textbox. What do you think.
ASKER
ok yes that would work I can add a control to that like you showed here for the total. I would just have to have it load the total the first time around before they start entering anything.
ASKER
so I added those controls and I got an error on lblObj.innerHTML = total;. It said Unknown Runtime Error. So if I can get past that and the total loads and somehow on the page load it creates the initial total I think it will be perfect. Thanks again for all your help this is a tough one.
ASKER
ok changed the following:
lblObj.value = total; instead of InnerHtml. So now all I think I need is it to initally load all the possible values of the columns first time in
lblObj.value = total; instead of InnerHtml. So now all I think I need is it to initally load all the possible values of the columns first time in
ASKER
Also I dont think the delta is working. The next time I change a value in the textbox it sets to zero everytime.
To you debug,
1. Add following code at the top of the page.
<script language="javascript">
function handleErr(err)
{
txt="There was an error on this page.\n\n"
txt+="Error: " + err + "\n"
alert(txt)
return true
}
onerror=handleErr
</script>
2. Delta working..
Take my last post and save as htm file and try this. I have tested before posted.
I could retest again.
1. Add following code at the top of the page.
<script language="javascript">
function handleErr(err)
{
txt="There was an error on this page.\n\n"
txt+="Error: " + err + "\n"
alert(txt)
return true
}
onerror=handleErr
</script>
2. Delta working..
Take my last post and save as htm file and try this. I have tested before posted.
I could retest again.
ASKER
I am using the HTML posted last a little further up in these posts. I will add the handeErr
ASKER
actually I am not getting any error anymore when changing the innerHTML to .value instead. But after the first set next time I change the value the total goes to zero.
ASKER
There was an unknown error on this page. But now I just changed the InnerHtml to value again and no error but the the next update say I have two boxes in the column 2 and 0. The first time the total updates to 2 if I just tab out without changing anything. The next time I change the 2 say to 4 it makes the total 0. Then I tab to the next column that has 2 in each row textbox. When I tab out without changing anything the total updates to 4. When I change a 2 say to 1 it should go to 3 and it always now sets to 0 everytime
ASKER
i am going to debug after the doneonce get set and it goes to incremental. I am going to run some alerts in a bit here and see whats happening. Is there a way I can on the page load have those load the total value?
ASKER
ok sorry its fixed now I had to set that InnerHtml to value as well so all I have left is to load on the page load those values in.
ASKER
everything works now with the tabbing and delta etc. Is there a way we can have those load the initial values on the page load and then select .focus and .select on the 1st textbox?
Onload we run the function, as shown with following example
<html>
<head>
<title>Multi Column Qty Incremental Total, Calc on Load</title>
</head>
<body onLoad="DoInitialize();">
<script language="javascript">
var savedValue = 0;
var doneOnce = new Array();
function InitDones() {
doneOnce[0] = 'unused';
doneOnce[1] = false;
doneOnce[2] = false;
}
function DoInitialize() {
InitDones();
DoTotal (document.forms[0], null, 1);
DoTotal (document.forms[0], null, 2);
}
function DoTotal (theForm, theFld, lblId) {
var total= 0;
var elems = theForm.elements;
var lblObj = document.getElementById ('totalQty'+lblId);
//alert (' Idx ' + lblId + ' ' + doneOnce[lblId]);
if (!doneOnce[lblId]) {
window.status = 'Do All ';
for (ix=0; ix < elems.length; ix++) {
if (elems[ix].name.match ('GridQuantity'+lblId)) {
if (elems[ix].value.length) {
total += parseInt (elems[ix].value);
}
}
}
doneOnce[lblId] = true;
}
else {
window.status = 'Incremental ';
total = parseInt (lblObj.innerHTML);
curValue = parseInt(theFld.value);
window.status = 'Delta ' + (curValue - savedValue);
total += (curValue - savedValue);
savedValue = 0;
}
if (isNaN(total)) { total = 0; }
lblObj.innerHTML = total;
}
function ValidateIntNumber(fld) {
if(fld.value.match(/[^0-9]
fld.value=fld.value.replac
}
}
function SaveOldValue(fld) {
var value = fld.value;
if (!value.length) { value = 0; }
if (isNaN(value)) { value = 0; }
savedValue = parseInt(value);
window.status = 'Saved ' + savedValue;
}
</script>
<form name="MyForm">
<table id="table1">
<tr>
<td>Description</td>
<td>Quantity 1</td>
<td>Quantity 2</td>
</tr>
<tr>
<td>Description 1</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Description 2</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Description 3</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Total</td>
<td>
<span id='totalQty1'></span>
</td>
<td>
<span id='totalQty2'></span>
</td>
</tr>
</table>
</form>
</body>
</html>
<html>
<head>
<title>Multi Column Qty Incremental Total, Calc on Load</title>
</head>
<body onLoad="DoInitialize();">
<script language="javascript">
var savedValue = 0;
var doneOnce = new Array();
function InitDones() {
doneOnce[0] = 'unused';
doneOnce[1] = false;
doneOnce[2] = false;
}
function DoInitialize() {
InitDones();
DoTotal (document.forms[0], null, 1);
DoTotal (document.forms[0], null, 2);
}
function DoTotal (theForm, theFld, lblId) {
var total= 0;
var elems = theForm.elements;
var lblObj = document.getElementById ('totalQty'+lblId);
//alert (' Idx ' + lblId + ' ' + doneOnce[lblId]);
if (!doneOnce[lblId]) {
window.status = 'Do All ';
for (ix=0; ix < elems.length; ix++) {
if (elems[ix].name.match ('GridQuantity'+lblId)) {
if (elems[ix].value.length) {
total += parseInt (elems[ix].value);
}
}
}
doneOnce[lblId] = true;
}
else {
window.status = 'Incremental ';
total = parseInt (lblObj.innerHTML);
curValue = parseInt(theFld.value);
window.status = 'Delta ' + (curValue - savedValue);
total += (curValue - savedValue);
savedValue = 0;
}
if (isNaN(total)) { total = 0; }
lblObj.innerHTML = total;
}
function ValidateIntNumber(fld) {
if(fld.value.match(/[^0-9]
fld.value=fld.value.replac
}
}
function SaveOldValue(fld) {
var value = fld.value;
if (!value.length) { value = 0; }
if (isNaN(value)) { value = 0; }
savedValue = parseInt(value);
window.status = 'Saved ' + savedValue;
}
</script>
<form name="MyForm">
<table id="table1">
<tr>
<td>Description</td>
<td>Quantity 1</td>
<td>Quantity 2</td>
</tr>
<tr>
<td>Description 1</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Description 2</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Description 3</td>
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
<td><input type="text" onKeyUp="ValidateIntNumber
onblur="DoTotal(this.form,
</tr>
<tr>
<td>Total</td>
<td>
<span id='totalQty1'></span>
</td>
<td>
<span id='totalQty2'></span>
</td>
</tr>
</table>
</form>
</body>
</html>
ASKER
i actually handle this in my code for the focus. Thanks so much for all your help. I wish I could award more than 500 that was a huge help. Thanks again and have a great week. I appreciate it.
ASKER
one last question. When it checks for numeric, if the entered is not numeric it blanks out the box. Then I can tab out the total gets set to zero. But it was messing up the total number.
Sorry I forgot about the focus(),
that would be
document.forms[0].elements
Thanks for the points..
_PA
that would be
document.forms[0].elements
Thanks for the points..
_PA
I found a bug..
function DoTotal (theForm, theFld, lblId) {
var total= 0;
var elems = theForm.elements;
var lblObj = document.getElementById ('totalQty'+lblId);
//alert (' Idx ' + lblId + ' ' + doneOnce[lblId]);
if (!doneOnce[lblId]) {
window.status = 'Do All ';
for (ix=0; ix < elems.length; ix++) {
if (elems[ix].name.match ('GridQuantity'+lblId)) {
if (elems[ix].value.length) {
total += parseInt (elems[ix].value);
}
}
}
doneOnce[lblId] = true;
}
else {
window.status = 'Incremental ';
total = parseInt (lblObj.innerHTML);
// Bug correction.
curValue = theFld.value;
// Check for no value
if (!curValue.length) { curValue = 0; }
if (isNaN(curValue)) { curValue = 0; }
window.status = 'Delta ' + (curValue - savedValue);
total += (curValue - savedValue);
savedValue = 0;
}
if (isNaN(total)) { total = 0; }
lblObj.innerHTML = total;
}
function DoTotal (theForm, theFld, lblId) {
var total= 0;
var elems = theForm.elements;
var lblObj = document.getElementById ('totalQty'+lblId);
//alert (' Idx ' + lblId + ' ' + doneOnce[lblId]);
if (!doneOnce[lblId]) {
window.status = 'Do All ';
for (ix=0; ix < elems.length; ix++) {
if (elems[ix].name.match ('GridQuantity'+lblId)) {
if (elems[ix].value.length) {
total += parseInt (elems[ix].value);
}
}
}
doneOnce[lblId] = true;
}
else {
window.status = 'Incremental ';
total = parseInt (lblObj.innerHTML);
// Bug correction.
curValue = theFld.value;
// Check for no value
if (!curValue.length) { curValue = 0; }
if (isNaN(curValue)) { curValue = 0; }
window.status = 'Delta ' + (curValue - savedValue);
total += (curValue - savedValue);
savedValue = 0;
}
if (isNaN(total)) { total = 0; }
lblObj.innerHTML = total;
}
It is one fixed example of dynamic generated source but it would help to create script function which will addapt to your dynamic generated field names.