[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 425
  • Last Modified:

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
0
sbornstein2
Asked:
sbornstein2
  • 29
  • 10
  • 2
1 Solution
 
ZvonkoSystems architectCommented:
Post here the generated HTML source as seen in the browser.
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.

0
 
sbornstein2Author Commented:
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_Label3" title="1013375"><a id="dgResults__ctl180_Linkbutton3" href="javascript:__doPostBack('dgResults$_ctl180$Linkbutton3','')">1013375</a></span>
                        </td><td style="width:90px;">
                              <span id="dgResults__ctl180_Label7" title="GOOD Wabash Landing 9"><a id="dgResults__ctl180_Linkbutton5" href="javascript:__doPostBack('dgResults$_ctl180$Linkbutton5','')">GOOD Wabash ...</a></span>
                        </td><td style="width:15px;">9</td><td style="width:90px;">
                              <span id="dgResults__ctl180_Label4" title="West Lafayette">West Lafayet...</span>
                        </td><td style="width:15px;">IN</td><td style="width:90px;">
                              <span id="dgResults__ctl180_Label5" title="Craig Rittenhouse">Craig Ritten...</span>
                        </td><td style="width:50px;">
                              <input name="dgResults:_ctl180:GridQuantity1" type="text" value="1" id="dgResults__ctl180_GridQuantity1" tabindex="195" onKeyPress="Javascript:return keyCheck(event, this)" style="width:30px;" />
                        </td><td style="width:50px;">0</td><td style="width:50px;">
                              <input name="dgResults:_ctl180:GridQuantity2" type="text" value="0" id="dgResults__ctl180_GridQuantity2" tabindex="380" onKeyPress="Javascript:return keyCheck(event, this)" style="width:30px;" />
                        </td><td style="width:50px;">0</td>
      </tr>

as you can see the input boxes now
0
 
ZvonkoSystems architectCommented:
You did not show the Label with the initial quantity.
Can you post the complette page.

0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
sbornstein2Author Commented:
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.
0
 
Pravin AsarCommented:

<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.replace(/[^0-9]/g,'');
     }

}
</script>
<form>
<table id="table1">
<tr>
<td>Description</td>
<td>Quantity</td>
</tr>
<tr>
<td>Description 1</td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onblur=DoTotal(this.form); name="dgResults__ctl180_GridQuantity1"></td>
</tr>
<tr>
<td>Description 1</td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onblur=DoTotal(this.form);  name="dgResults__ctl180_GridQuantity2"></td>
</tr>
<tr>
<td>Description 1</td>
<td><input type="text"  onKeyUp="ValidateIntNumber(this)" onblur=DoTotal(this.form);  name="dgResults__ctl180_GridQuantity3"></td>
</tr>
</table>
</form>
Total is :<span id='totalQty'></span>
0
 
sbornstein2Author Commented:
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.
0
 
sbornstein2Author Commented:
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.
0
 
Pravin AsarCommented:
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.replace(/[^0-9]/g,'');
     }
}
</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(this)"
onblur="DoTotal(this.form, this, 1);" name="dgResults__ctl180_GridQuantity11"></td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)"
onblur="DoTotal(this.form, this, 2);" name="dgResults__ctl180_GridQuantity21"></td>
</tr>
<tr>
<td>Description 2</td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)"
onblur="DoTotal(this.form, this, 1);" name="dgResults__ctl180_GridQuantity12"></td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)"
onblur="DoTotal(this.form, this, 2);" name="dgResults__ctl180_GridQuantity22"></td>
</tr>
<tr>
<td>Description 3</td>
<td><input type="text"  onKeyUp="ValidateIntNumber(this)"
onblur="DoTotal(this.form, this, 1);"  name="dgResults__ctl180_GridQuantity13"></td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)"
onblur="DoTotal(this.form, this, 2);" name="dgResults__ctl180_GridQuantity23"></td>
</tr>
<tr>
<td>Total</td>
<td>
<span id='totalQty1'></span>
</td>
<td>
<span id='totalQty2'></span>
</td>
</tr>
</table>
</form>
</body>
</html>

   
0
 
Pravin AsarCommented:
Here is a incremental solution...

<html>
<head>
<title>Multi Column Qty Incremental Total</title>
</head>

<body>
<script language="javascript">
var savedValue = 0;
var doneOnce = new Array();
doneOnce[0] = 'unused';
doneOnce[1] = false;
doneOnce[2] = false;
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.replace(/[^0-9]/g,'');
     }
}
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>
<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(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 1);" name="dgResults__ctl180_GridQuantity11"></td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 2);" name="dgResults__ctl180_GridQuantity21"></td>
</tr>
<tr>
<td>Description 2</td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 1);" name="dgResults__ctl180_GridQuantity12"></td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 2);" name="dgResults__ctl180_GridQuantity22"></td>
</tr>
<tr>
<td>Description 3</td>
<td><input type="text"  onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 1);"  name="dgResults__ctl180_GridQuantity13"></td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 2);" name="dgResults__ctl180_GridQuantity23"></td>
</tr>
<tr>
<td>Total</td>
<td>
<span id='totalQty1'></span>
</td>
<td>
<span id='totalQty2'></span>
</td>
</tr>
</table>
</form>
</body>
</html>
0
 
sbornstein2Author Commented:
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-collapse:collapse;">
      <tr class="AllocateDataGridHeader">
            <td><a href="javascript:__doPostBack('dgResults$_ctl2$_ctl0','')">TES</a></td><td><a href="javascript:__doPostBack('dgResults$_ctl2$_ctl1','')">LOCATION</a></td><td><a href="javascript:__doPostBack('dgResults$_ctl2$_ctl2','')">SC</a></td><td><a href="javascript:__doPostBack('dgResults$_ctl2$_ctl3','')">CITY</a></td><td><a href="javascript:__doPostBack('dgResults$_ctl2$_ctl4','')">ST</a></td><td><a href="javascript:__doPostBack('dgResults$_ctl2$_ctl5','')">CONTACT</a></td><td colspan="2" style="width:110px;"><table width="100%"><tr class="AllocateDataGridHeaderTable"><td colspan="2"><label id='filmtitle1' title='2006 Oscar'>2006 Oscar</label><br><label id='partname1' title='Exhibitor White Glove 2-Sided One Sheet'>Exhibitor White...</label></td></tr><tr class="AllocateDataGridHeaderTable"><td width="50%">Tot Qty</td><td style="padding-left: 5px;" width="50%">Ship Qty</td></tr></table></td><td colspan="2" style="width:110px;"><table width="100%"><tr class="AllocateDataGridHeaderTable"><td colspan="2"><label id='filmtitle2' title='2006 Oscar'>2006 Oscar</label><br><label id='partname2' title='Sweepstakes White Glove 1-Sided One Sheet'>Sweepstakes Whi...</label></td></tr><tr class="AllocateDataGridHeaderTable"><td width="50%">Tot Qty</td><td style="padding-left: 5px;" width="50%">Ship Qty</td></tr></table></td>
      </tr><tr class="AllocateDataGridItem" onmouseover="this.className='AllocateDataGridItemOver'" onmouseout="this.className='AllocateDataGridItem'">
            <td style="width:40px;">
                              <span id="dgResults__ctl3_Label3" title="1014312"><a id="dgResults__ctl3_Linkbutton3" href="javascript:__doPostBack('dgResults$_ctl3$Linkbutton3','')">1014312</a></span>
                        </td><td style="width:90px;">
                              <span id="dgResults__ctl3_Label7" title="RAVE Jefferson Point"><a id="dgResults__ctl3_Linkbutton5" href="javascript:__doPostBack('dgResults$_ctl3$Linkbutton5','')">RAVE Jeffers...</a></span>
                        </td><td style="width:15px;">18</td><td style="width:90px;">
                              <span id="dgResults__ctl3_Label4" title="Fort Wayne">Fort Wayne</span>
                        </td><td style="width:15px;">IN</td><td style="width:90px;">
                              <span id="dgResults__ctl3_Label5" title="Andrew Warren">Andrew Warre...</span>
                        </td><td style="width:50px;">
                              <input name="dgResults:_ctl3:GridQuantity1" type="text" value="1" id="dgResults__ctl3_GridQuantity1" tabindex="18" onKeyPress="Javascript:return keyCheck(event, this)" style="width:30px;" />
                        </td><td style="width:50px;">0</td><td style="width:50px;">
                              <input name="dgResults:_ctl3:GridQuantity2" type="text" value="2" id="dgResults__ctl3_GridQuantity2" tabindex="20" onKeyPress="Javascript:return keyCheck(event, this)" style="width:30px;" />
                        </td><td style="width:50px;">0</td>
      </tr><tr class="AllocateDataGridItem" onmouseover="this.className='AllocateDataGridItemOver'" onmouseout="this.className='AllocateDataGridItem'">
            <td style="width:40px;">
                              <span id="dgResults__ctl4_Label3" title="1004306"><a id="dgResults__ctl4_Linkbutton3" href="javascript:__doPostBack('dgResults$_ctl4$Linkbutton3','')">1004306</a></span>
                        </td><td style="width:90px;">
                              <span id="dgResults__ctl4_Label7" title="REGL Coldwater Crossing"><a id="dgResults__ctl4_Linkbutton5" href="javascript:__doPostBack('dgResults$_ctl4$Linkbutton5','')">REGL Coldwat...</a></span>
                        </td><td style="width:15px;">8</td><td style="width:90px;">
                              <span id="dgResults__ctl4_Label4" title="Fort Wayne">Fort Wayne</span>
                        </td><td style="width:15px;">IN</td><td style="width:90px;">
                              <span id="dgResults__ctl4_Label5" title="Jim Buffenburger">Jim Buffenbu...</span>
                        </td><td style="width:50px;">
                              <input name="dgResults:_ctl4:GridQuantity1" type="text" value="0" id="dgResults__ctl4_GridQuantity1" tabindex="19" onKeyPress="Javascript:return keyCheck(event, this)" style="width:30px;" />
                        </td><td style="width:50px;">0</td><td style="width:50px;">
                              <input name="dgResults:_ctl4:GridQuantity2" type="text" value="2" id="dgResults__ctl4_GridQuantity2" tabindex="21" onKeyPress="Javascript:return keyCheck(event, this)" style="width:30px;" />
                        </td><td style="width:50px;">0</td>
      </tr><tr class="AllocateDataGridItem">
            <td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>
                               <span id="dgResults__ctl5_lblGrandTotalTitle">Total Allocated:</span><br>
                               <span id="dgResults__ctl5_lblGrandTotalTitle2">Total Available:</span>
                        </td><td>
                               <span id="dgResults__ctl5_lblTotalAllocated1">1</span><br>
                               <span id="dgResults__ctl5_lblTotalAvailable1">1812</span>
                        </td><td>&nbsp;</td><td>
                               <span id="dgResults__ctl5_lblTotalAllocated2">4</span><br>
                               <span id="dgResults__ctl5_lblTotalAvailable2">394</span>
                        </td><td>&nbsp;</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.
0
 
sbornstein2Author Commented:
actually I see what your doing here I will try this now
0
 
sbornstein2Author Commented:
it looks like I will have to do a match because it appends that front text to the total labels as well
0
 
sbornstein2Author Commented:
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
0
 
sbornstein2Author Commented:
forget that last post somehow that script was not your last script not sure what I copied.
0
 
sbornstein2Author Commented:
so I think the null is just I am doing the elem match wrong for the lblTotalAllocated
0
 
Pravin AsarCommented:
Just checking, do you need further help understanding my code..

0
 
sbornstein2Author Commented:
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?
0
 
Pravin AsarCommented:
You have  label with id prefix..

dgResults__ctl5_lblTotalAllocatedXXX

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:GridQuantity1
dgResults:_ctl4:GridQuantity1

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_lblTotalAllocated1
dgResults__ctl5_lblTotalAllocated2

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:GridQuanity  => Third Row, Third Column
dgResults:_ctl4C:GridQuanity  => Fouth Row, Third Column

dgResults__ctl5C_lblTotalAllocated  => Fifth row, Third column

Based on the schema you adpot, we can finetune the function.

Thanks,

_PA
0
 
sbornstein2Author Commented:
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:GridQuanity.  Then same for the lblTotalAllocated but it only renders that row once because it is in a FooterTemplate.  So as shown in that HTML code I pasted above you can see there is 2 lblTotalAllocated controls rendered when I selected 2 products.  So for each new product a new column would have generated a new control.  I cant control how that is rendered unless I take it out of the grid.  For this purpose its tough to line up a bottom table to the above grid so I just place in a FooterTemplate in the datagrid to allow that to generate.
0
 
sbornstein2Author Commented:
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?
0
 
sbornstein2Author Commented:
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.
0
 
Pravin AsarCommented:
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  
0
 
sbornstein2Author Commented:
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
0
 
sbornstein2Author Commented:
also the spans are created by the render of the HTML as well from the .Net page.
0
 
sbornstein2Author Commented:
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("lblTotalAvailable1");
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.
0
 
sbornstein2Author Commented:
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.
0
 
sbornstein2Author Commented:
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.
0
 
sbornstein2Author Commented:
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
0
 
sbornstein2Author Commented:
Also I dont think the delta is working.  The next time I change a value in the textbox it sets to zero everytime.
0
 
Pravin AsarCommented:
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.

0
 
sbornstein2Author Commented:
I am using the HTML posted last a little further up in these posts.   I will add the handeErr
0
 
sbornstein2Author Commented:
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.  
0
 
sbornstein2Author Commented:
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
0
 
sbornstein2Author Commented:
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?
0
 
sbornstein2Author Commented:
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.
0
 
sbornstein2Author Commented:
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?
0
 
Pravin AsarCommented:
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.replace(/[^0-9]/g,'');
     }
}
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(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 1);" value="1" name="dgResults__ctl180_GridQuantity11"></td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 2);" value="11" name="dgResults__ctl180_GridQuantity21"></td>
</tr>
<tr>
<td>Description 2</td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 1);" value="2" name="dgResults__ctl180_GridQuantity12"></td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 2);" value="12" name="dgResults__ctl180_GridQuantity22"></td>
</tr>
<tr>
<td>Description 3</td>
<td><input type="text"  onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 1);" value="3"  name="dgResults__ctl180_GridQuantity13"></td>
<td><input type="text" onKeyUp="ValidateIntNumber(this)" onFocus="SaveOldValue(this);"
onblur="DoTotal(this.form, this, 2);" value="13" name="dgResults__ctl180_GridQuantity23"></td>
</tr>
<tr>
<td>Total</td>
<td>
<span id='totalQty1'></span>
</td>
<td>
<span id='totalQty2'></span>
</td>
</tr>
</table>
</form>
</body>
</html>
0
 
sbornstein2Author Commented:
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.
0
 
sbornstein2Author Commented:
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.
0
 
Pravin AsarCommented:
Sorry I forgot about the focus(),

that would  be

 
document.forms[0].elements[0].focus();


Thanks for the points..

_PA
0
 
Pravin AsarCommented:
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;
}
0

Featured Post

Vote for the Most Valuable Expert

It’s time to recognize experts that go above and beyond with helpful solutions and engagement on site. Choose from the top experts in the Hall of Fame or on the right rail of your favorite topic page. Look for the blue “Nominate” button on their profile to vote.

  • 29
  • 10
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now