I'm not sure if you're using VB.NET or C# for your server code.
But the idea is to configure the TextBox elements to call a JavaScript method during the JavaScript onblur event.
To do this you use the TextBox's Attributes property like so:
VB.NET:
- TextBox2.Attributes.Add("onblur","doSum()")
The C# is pretty much the same thing:
- TextBox2.Attributes.Add("onblur","doSum()");
Now all you have to do is add the "doSum()" JavaScript method to the page somehow. It could be in an external JavaScript file, written directly into the ASP page, or you could dynamically generate the doSum() method in your VB or C# code and register it with the page (using either the ScriptManager if you're using Ajax or the Page.ClientScript if you're not using Ajax).
I would probably recommend writing the method directly into the ASP page because it's easiest.
Now, the important thing to note is that your TextBox ID client-side may not be the same as the TextBox ID server-side. This has to do with the NamingContainer to ensure that every element on the page has a unique ID client side. For example, you could have a TextBox1 in User Control "A" and you could also have a TextBox1 in User Control "B". In order to keep your HTML valid ASP.NET gives these TextBoxes unique IDs when they are rendered int he browser. This means that TextBox1 in User Control A would have an ID client side something like 'ctrl100_UserControlA_TextBox1" and TextBox1 in User Control B would have the ID: 'ctrl100_UserControlB_TextBox1".
To access this unique, client-side ID in your server-side code you use the TextBox's ClientID property.
You could pass these clientID's as parameters to the "doSum()" JavaScript method and then use the document.getElementById() to grab the values in the TextBoxes that need to be added together.
But to do this you'll have to change the TextBox's Attributes property to be:
VB.NET:
- TextBox1.Attributes.Add("onblur","doSum('"+TextBox1.ClientID+"','"+TextBox2.ClientID+"')")
C# :
- TextBox1.Attributes.Add("onblur","doSum('"+TextBox1.ClientID+"','"+TextBox2.ClientID+"')");
If you don't want to pass parameters into the doSum method then you'd use the ASP Response.Write() method to dynamically write the ClientID of the TextBoxes directly into the JavaScript code in your ASP page......
For example, this code would be placed on the ASP page....Please note that anything between the <% %> is executed on the server. The following is VB.NET code:
- function doSum(){
-
var textBox1 = document.getElementById('<%Response.Write("TextBox1.ClientID")%>');
-
var num1 = Number(textBox1.value);
-
-
var textBox2 = document.getElementById('<%Response.Write("TextBox2.ClientID")%>');
-
var num2 = Number(textBox2.value);
-
-
var sum = num1 + num2;
-
}
The ASP shorthand for Response.Write is <%= %>....so you could also have:
- function doSum(){
-
var textBox1 = document.getElementById('<%=TextBox1.ClientID%>');
-
var num1 = Number(textBox1.value);
-
-
var textBox2 = document.getElementById('<%=TextBox2.ClientID%>');
-
var num2 = Number(textBox2.value);
-
-
var sum = num1 + num2;
-
}
That should get you started :)
-Frinny
