Calculating Sum of Textbox Values via Client-Side Code in User Controls


I am creating a simple user control that will have 4 textboxes stacked on top of each other and then a label underneath that will calculate the sum of the textboxes with client-side code.  I know that you can essentially package javascript with a user control with the RegisterClientScript method but I'm having trouble figuring out how I can write the code so that I can have multiple controls on the page and each control will know to populate their total labels with the values from only their textboxes.  I would also like to be able to do it without having to register multiple versions of the same client script with references to different HTML controls in them.  Any thoughts on how I might achieve this?


Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Use a regular javascript function (or functions), and bind the onchange JS event to that function.  The trick is that where you need to reference the .net controls, you need to put code like the attached snippet in place to get the correct value.
Document.getElementById('<%= DropDownList1.ClientID %>')

Open in new window


Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
MClarkCCRAuthor Commented:

I can see how that works, so lets say in the codebehind of my User Control I will do a RegisterClientScript for a function called something like

function SumTextBoxes(txt1, txt2, txt3, txt4, lblSum)
  // Add values of textboxes and assign to lblSum

that accepts the relevant controls as parameters and then register the function in the onChange event of every textbox ( i.e. onChange="SumTextBoxes(<%= txt1.ClientID %>, etc, etc, etc, etc);") and that should work, right?

Also, since I am using RegisterClientScript, each time I load a new control when it tries to register its clientscript it will see that it was previously added by another control and not create duplicate javascript, correct?

I'm not sure about whether you'd get duplicate js with RegisterClientScript.

What I was referring to was putting the JS function in the .aspx file (like you would a normal HTML page), not the code-behind.
MClarkCCRAuthor Commented:
I'm pretty sure that it wouldn't register it again, since you specify a keyname for the script when you register.  I'll just have to try it out to be sure.  The only reason I want to register the JS in the codebehind is so that anyone who uses the control in the future doesn't have to include a .js file with it or add the script to the top of the page.  It packages it all nice and neat together :) .  At any rate, I think I've got a good start to work with.  Thanks for your help!

It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.