Question

I am new to client-side scripting. My problem is I’ve got a lot of textboxes and I want them to auto-calculate, but so far nothing works. Is there something wrong on my script?

function totaltraininghour()
{
var totalhour1=0;
var a1= parseInt(document.getElementById("a1").value);
var b1= parseInt(document.getElementById("b1").value);
var c1= parseInt(document.getElementById("c1").value);
var d1= parseInt(document.getElementById("d1").value);

var totalhour2=0;
var a2= parseInt(document.getElementById("a2").value);
var b2= parseInt(document.getElementById("b2").value);
var c2= parseInt(document.getElementById("c2").value);
var d2= parseInt(document.getElementById("d2").value);

var totalhour3=0;
var a3= parseInt(document.getElementById("a3").value);
var b3= parseInt(document.getElementById("b3").value);
var c3= parseInt(document.getElementById("c3").value);
var d3= parseInt(document.getElementById("d3").value);
var totaltraining=0;

if (a1 >=0)
{
totalhour1 = totalhour1 + a1
}
if (b1>=0)
{
totalhour1 = totalhour1+ b1
}
if (c1>=0)
{
totalhour1 = totalhour1+ c1
}
if (d1>=0)
{
totalhour1 = totalhour1+ d1
}
document.getElementById("txttotalhour1").value = totalhour1

if (a2 >=0)
{
totalhour2 = totalhour2 + a2
}
if (b2>=0)
{
totalhour2 = totalhour2+ b2
}
if (c2>=0)
{
totalhour2 = totalhour2+ c2
}
if (d2>=0)
{
totalhour2 = totalhour2+ d2
}
document.getElementById("txttotalhour2").value = totalhour2

if (a3 >=0)
{
totalhour3 = totalhour2 + a3
}
if (b3>=0) 
{
totalhour3 = totalhour2+ b3
 }
if (c3>=0)
{
totalhour3 = totalhour2+ c3
}
if (d3>=0)
{
totalhour3 = totalhour2+ d3
}
document.getElementById("txttotalhour3").value = totalhour3

totaltraining = totalhour1 + totalhour2 + totalhour3
document.getElementById("txttotaltraininghours").value = totaltraining
 </script>

<asp:TextBox ID="a2" runat="server" Width="100px" onkeyup="totaltraininghour
();"></asp:TextBox> And so on..

Answer 1

Make sure your IDs are what you think they are. If the controls are within a naming container, the IDs will be mangled. To get around it, have ASP.NET insert the ClientID, like this:

var a1= parseInt(document.getElementById("<%= a1.ClientID %>").value);

Note, unless you fiddle with your web server’s settings, this will only work for scripts within .aspx files, not external .js files.