i have a multiple textboxes in repeater and i will ent开发者_Go百科er 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.
Here is one idea to get you started:
- Put a
<div>
around yourRepeater
and give it a uniqueid
. - Use the
document.getElementById()
function in JavaScript to obtain a reference to that<div>
. - Use the
getElementsByTagName()
function in the DOM element to find all<input>
s within. - 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:
If you know exactly how many
<input>
elements you have in each "line", you can change thefor
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)
Change your markup to include a
class
attribute on the<input>
elements to be part of the sum. Within thefor
loop, do a test oninputs[i].className
to verify if the particular field is to be included.
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.
<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.
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);
精彩评论