Textbox onchange event using jquery raises JScript runtime error: "Deductions" - undefined

Question

I have a jQuery call request for a text field exchange event.

in my encoding, I raise the change event as

<asp:TextBox ID="txtTotalDeductions" Text="0" runat="server" ClientIDMode="Static" onChange="Deductions();" ></asp:TextBox> 

and I have two div sections like

 <div id="Total">1000</div> 

and

 <div id="NetTotal">0</div> 

I need to calculate "NetTotal" by subtracting Total-txtTotalDeductions.

and my jQuery for deductions

// Calculation of residues.

 function Deductions() { var result = new Object(); result.total = $("#Total").html(); result.totalDeductions = $("#txtTotalDeductions").val(); result.netTotal = result.total - result.totalDeductions; $('#NetTotal').html(result.netTotal); } 

and when I run the application, the error is displayed as "Microsoft JScript runtime error:" Deductions "is undefined" and the error is here "

can someone help me with pls ..... thanks in advance

Answer 1

remove the OnChange handler

 function Deductions() { var result = new Object(); result.total = $("#Total").html(); result.totalDeductions = $("#txtTotalDeductions").val(); result.netTotal = result.total - result.totalDeductions; $('#NetTotal').html(result.netTotal); } 

also wraps code inside the finished handler and attaches the change event handler

 $(document).ready(function(){ //attach with the id od deductions $("#txtTotalDeductions").bind("change",Deductions); }); 

Answer 2

Change your jScript to this, this will help:

 $(function (){ $('#txtTotalDeductions').change(function (){ var total = $("#Total").html(); var totalDeductions = $("#txtTotalDeductions").val(); var netTotal = total - totalDeductions; $('#NetTotal').html(netTotal); }); }); 

You can also use an object. I deleted it for my convenience.

edit:

Remove the onchange event from the text box, and also remove the function output.