1

i have a multiple textboxes in repeater and i will enter value in those textboxes at runtime. and i want sum of all value entered in those textboxes in one label.i want to do this thing using java script. so can u please help me.

3
  • 3
    This is not the place where you ask for finished code. Try to code it, then ask for help if you get stuck. Commented Apr 22, 2010 at 18:32
  • There's a discussion of this topic on the JQuery forum which might help. Commented Apr 22, 2010 at 18:32
  • Somebody please rename this. And maybe retag. And some more info wouldn't hurt either. Commented Apr 22, 2010 at 18:32

4 Answers 4

6

Here is one idea to get you started:

  1. Put a <div> around your Repeater and give it a unique id.
  2. Use the document.getElementById() function in JavaScript to obtain a reference to that <div>.
  3. Use the getElementsByTagName() function in the DOM element to find all <input>s within.
  4. Loop over them, adding their values (parsed as integers) together.

So if your markup looks something like this:

<div id="coolStuff">
    <asp:Repeater ... >
</div>

The JavaScript looks approximately like this:

var container = document.getElementById("coolStuff");
var inputs = container.getElementsByTagName("input");

var sum = 0;

for (var i = 0; i < inputs.length; i++) {
    sum += inputs[i].value;
}

alert(sum);

Now, this code does not check to ensure that the <input>s are actually of type=text or to confirm that the entered values are numbers. Those parts are left as exercises for the reader ;)


Edit: If you have multiple text boxes in each "line" outputted by the Repeater and you only want to sum the values for one "group" of boxes, you will need to change the script a bit. Here are two possible solutions - pick one:

  1. If you know exactly how many <input> elements you have in each "line", you can change the for loop in the client script to only visit every Nth element. Eg. to select only the last of three fields in each line: for (var i = 2; i < inputs.length; i += 3)

  2. Change your markup to include a class attribute on the <input> elements to be part of the sum. Within the for loop, do a test on inputs[i].className to verify if the particular field is to be included.

Sign up to request clarification or add additional context in comments.

4 Comments

you all right but i have 3 different coulmn.if i do this logic then it will do sum for all text boxes.for that i want txext box by it's unique id.but when i do container.getElementByID.it's not supported. it only support container.getElementTagName.i want 3 different sum for 3 difefrent coulmn.and if i do simple document.getelementID() it also not works becoz in repeater they generate different id for all text boxes.is there any way to get that different id's in loop.
container.getElementById() (notice lower-case d) is supported, but it will not help you here. The value for the id attribute on the <input> is determined by ASP.NET and it is really unique, across the entire page.
@Nikunj: I have updated my answer with some ideas for how to get around the additional requirement presented in your comment.
finally i used this.because using this i can identify textbox using class. viralpatel.net/blogs/2009/07/…
2

Something like so, assuming that you want to sum all textboxes in the repeater control. This will only sum number values too.

var repeater = document.getElementById('repeater_id');
var inputs = repeater.getElementsByTagName('input');
var sum = 0;
for (var i=0; i < inputs.length; i++) {
    if (inputs[i].type === "text" && /^\d+$/.test(inputs[i].value)) {
        sum += inputs[i].value;
    }
}

If you're doing a lot of client-side stuff, why not take a look at doing this with a library, such as jQuery.

1 Comment

you all right but i have 3 different coulmn.if i do this logic then it will do sum for all text boxes.for that i want txext box by it's unique id.but when i do container.getElementByID.it's not supported. it only support container.getElementTagName.i want 3 different sum for 3 difefrent coulmn.and if i do simple document.getelementID() it also not works becoz in repeater they generate different id for all text boxes.is there any way to get that different id's in loop
0
<asp:Repeater ID="rpt" CssClass="rpt">
<itemTemplate>
  <asp:TextBox ID="txtValue" />
</itemTemplate>
<footerTemplate>
  <asp:Label Id="lblResult" CssClass="result" />
</footerTemplate>
</asp:Repeater>

javascript using jQuery:

$(document).ready(function(){
  $('.rpt input[type=text]').live('onchange', calc);
});

function calc(){
  var result = 0;
 $('.rpt input[type=text]').each(function(){
  // need better input cleaning here...
  result += parseInt($(this).val());
  });
  $('.rpt .result').val(result);
}

HTH.

Comments

0

Get jQuery. Add a class to the textbox in the repeater markup using eg CssClass ='totals'. Use the following jQuery code to total the values

var total = 0;
$('input.totals').each(function(){

 if (!isNan($(this).text())) total += $(this).text()
});

alert('Total is ' + total);

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.