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

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

Asp.net Textbox onChange

Hello, I have the following controls for calculating total:
txtSubtotal, txtMisc, txtShipping, lblTotal

I need help figuring out how to do this scenario:
The textbox and label are originally populated from a server side method. I need this to happen if the user changes the text in any of the textboxes.

A new new total is calculated and the lblTotal is changed to the new total. I don't want to post back to the server.

How can I do this?
0
gogetsome
Asked:
gogetsome
1 Solution
 
Kyle AbrahamsSenior .Net DeveloperCommented:
You can use javascript . . . also AJAX might take care of the postback issue for you as well.

0
 
Fahad PathanCommented:
@ged325..
AJAX takes d process to server side.. but it takes only partial data.

@gogetsome..
u ve to use javascript or jquery for the same which are client side scripting...
so basically u ve to use client side scripting...
0
 
princeatapiCommented:
Very well you can go with javascript , thats pretty simple instead of making a post back to perform this simple operation .
0
Free Backup Tool for VMware and Hyper-V

Restore full virtual machine or individual guest files from 19 common file systems directly from the backup file. Schedule VM backups with PowerShell scripts. Set desired time, lean back and let the script to notify you via email upon completion.  

 
Mohit VijayCommented:
Create below javascript function
---------------------------------------------------------------
function CalculateTotal()
{
var Sum;
Sum=0;

if (document.getElementById('txtSubtotal').value !="")
Sum = Sum  + Number(document.getElementById('txtSubtotal').value);

if (document.getElementById('txtSubtotal').value !="")
Sum = Sum  + Number(document.getElementById('txtSubtotal').value);

if (document.getElementById('txtSubtotal').value !="")
Sum = Sum  + Number(document.getElementById('txtSubtotal').value);

document.getElementById('lblTotal').innerHTML = Sum;
return false;
}
---------------------------------------------------------------

add attribute with all three textbox

onchange="javascript:return CalculateTotal();" [in you want to calculate on value change]

or

onblur ="javascript:return CalculateTotal();" [in you want to calculate on lost focus]

-------------

Please dont try to copy paste above code, I may have wrtting some wrong syntext, javascript is case sensitve, so please think twice and use above code, Functionality wise my logic is perfect.
0
 
gogetsomeAuthor Commented:
Thanks Guys! Yes... I want to use some form of clientside javascript.

ViSoft, I put the code below in my application and nothing happens. The casing look correct to me with my limited javascript exposure.. What could be wrong?



I put this into the head of the masterpage:

<script type="text/javascript">

function CalculateTotal()
{
var Sum;
Sum=0;

if (document.getElementById('txtSubtotal').value !="")
Sum = Sum  + Number(document.getElementById('txtSubtotal').value);

if (document.getElementById('txtTax').value !="")
Sum = Sum  + Number(document.getElementById('txtTax').value);

if (document.getElementById('txtMisc').value !="")
Sum = Sum  + Number(document.getElementById('txtMisc').value);

if (document.getElementById('txtShipping').value !="")
Sum = Sum  + Number(document.getElementById('txtShipping').value);

document.getElementById('lblTotal').innerHTML = Sum;
return false;
}

</script>


I put this in each textbox control:

 onchange="javascript:return CalculateTotal();"
0
 
gogetsomeAuthor Commented:
Additional info which may change things. The controls are within a usercontrol that I place on the page that loads into the masterpage with the javascript. Also, when the usercontrol is first loaded the text boxes are set to false. It is not untill products and shipping are added that the textboxes are set to visible = true...
0
 
gogetsomeAuthor Commented:
For anyone coming along later. To get the javascript to work you have to have the correct getElementById for each control. To get this just view source of the page when running as the name of the control that the javascript can see is based on where the control resides.

For example:

ctl00_ContentPlaceHolder1_ctlCreateOrder_txtSubTotal
0
 
Kyle AbrahamsSenior .Net DeveloperCommented:
Note that the control may change.  There is a .clientID on the ASPX side which you can pass to the javascript.
0
 
gogetsomeAuthor Commented:
Thank you ged325! I have read that but did not know how to actually modify the JavaScript since the textbox and label controls are in a usercontrol on a child page of a mater page... Do you know what I should modify?
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now