display running total using all client side code

  • Thread starter Thread starter Paul
  • Start date Start date
P

Paul

Hi I have a webform with several entry boxes and the user enters numbers in
each box. I keep a running total (just adds all of the entries together) but
am posting back to the server to do this. Is there any way to do it all on
the client side, without posting back to the server? I would like to update
the running total each time the user inputs an amount in a textbox and then
goes to the next textbox.
Thanks,
 
attach a javascript hander to the onblur event of each textbox. is this
handler add up the textbox values, and display in whatever you are displaying
in:

sample:

// add textbox in InputPanel and put total in last

var panel = document.getElementById('<%= inputPanel.ClientID%>');
var list = panel.getElementsByTagName('input');
var textboxList = [];
for (var i=0; i < list.length - 1; ++i)
{
if (list.type.toLowerCase() == 'text')
{
textboxList.push(list);
list.onblur = doBlur;
}
}

function doBlur(e) {
var total = 0;
for (var i=0; i < textboxList.length - 1; ++i)
{
total += parseFloat(textboxList.value);
}
textboxList[textboxList.length-1].value = total;
}


-- bruce (sqlwork.com)
 
thanks for the response. I am really not too good with javascript but just
for clarity what controls as well as the controlnames do I need to put on the
page to work with your example?
--
Paul G
Software engineer.


bruce barker said:
attach a javascript hander to the onblur event of each textbox. is this
handler add up the textbox values, and display in whatever you are displaying
in:

sample:

// add textbox in InputPanel and put total in last

var panel = document.getElementById('<%= inputPanel.ClientID%>');
var list = panel.getElementsByTagName('input');
var textboxList = [];
for (var i=0; i < list.length - 1; ++i)
{
if (list.type.toLowerCase() == 'text')
{
textboxList.push(list);
list.onblur = doBlur;
}
}

function doBlur(e) {
var total = 0;
for (var i=0; i < textboxList.length - 1; ++i)
{
total += parseFloat(textboxList.value);
}
textboxList[textboxList.length-1].value = total;
}


-- bruce (sqlwork.com)


Paul said:
Hi I have a webform with several entry boxes and the user enters numbers in
each box. I keep a running total (just adds all of the entries together) but
am posting back to the server to do this. Is there any way to do it all on
the client side, without posting back to the server? I would like to update
the running total each time the user inputs an amount in a textbox and then
goes to the next textbox.
Thanks,
 
Hi, I have it set up with 2 text boxes in the panel and a <input
name="result"/> outside of the panel to display the results by using
document.form1.result.value= total in the function doBlur(e). Also for the
two textboxes if have
<input type="text" id="txbx1" onblur="doBlur()" style="position: relative"/>
<input type="text" id="txbx2" onblur="doBlur()" style="position:
relative"/>
Do I need to pass something to doBlur as what is happening now is when I
type any number in the first textbox and then click away (for the onblur
event) The number in both the first text box and my result box is set to 0.
The second text box does not seem to have an effect on anything. Thanks.
--
Paul G
Software engineer.


bruce barker said:
attach a javascript hander to the onblur event of each textbox. is this
handler add up the textbox values, and display in whatever you are displaying
in:

sample:

// add textbox in InputPanel and put total in last

var panel = document.getElementById('<%= inputPanel.ClientID%>');
var list = panel.getElementsByTagName('input');
var textboxList = [];
for (var i=0; i < list.length - 1; ++i)
{
if (list.type.toLowerCase() == 'text')
{
textboxList.push(list);
list.onblur = doBlur;
}
}

function doBlur(e) {
var total = 0;
for (var i=0; i < textboxList.length - 1; ++i)
{
total += parseFloat(textboxList.value);
}
textboxList[textboxList.length-1].value = total;
}


-- bruce (sqlwork.com)


Paul said:
Hi I have a webform with several entry boxes and the user enters numbers in
each box. I keep a running total (just adds all of the entries together) but
am posting back to the server to do this. Is there any way to do it all on
the client side, without posting back to the server? I would like to update
the running total each time the user inputs an amount in a textbox and then
goes to the next textbox.
Thanks,
 
Back
Top