jquery loop over input value and get sum

Question

I have input sliders (see jsfiddle) that on change i'd like to loop through their values and get a total.

I wrote the code I thought would do this, but i failed, see the fiddle and thank you so much in advance!

Percentage Sliders<br><br>
<input type="tex" class="slida" type="text" data-slider="true" data-slider-range="0,100" data-slider-step="25" data-slider-snap="true" data-slider-theme="volume" >
<br><br>

<input type="tex" class="slida" type="text" data-slider="true" data-slider-range="0,100" data-slider-step="25" data-slider-snap="true" data-slider-theme="volume" > 


$(".slida").bind("slider:changed", function (event, data) {
  console.log("Changed Value: ", data.value);
  $(this).each(function() {
    total = 0;
    $(this).each(function() {
        total += parseInt( $(this).val() );    
    });     
  });  
  console.log("TOTAL: ", total)

});
// end

You overwrite your total inside your each every single time, you need to specify your total outside the scope of the event binding. If you're looking to keep totals independently for the 2 sliders, that will require a little extra brain power. — Kyle Muir
– Kyle Muir, Commented Jul 30, 2013 at 0:24

Ohgodwhy · Accepted Answer · 2013-07-30 00:22:36Z

14

The $(this) you iterate over is only the element that is changed, therefore $.each() will not serve any purpose under that context...however

var total = 0;
$('.slida').each(function(){
   total += parseInt($(this).val());
});

Would definitely fit the mold, as you access the value of all the sliders, instead of just the one that you're firing the event on.

As usual, here's your Fiddle

answered Jul 30, 2013 at 0:22

Ohgodwhy

50.9k11 gold badges86 silver badges114 bronze badges

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

2 Comments

jahrichie Over a year ago

Fast, concise, and clean. Thank you so much!

Muddasir Abbas Over a year ago

if forget to parseInt

Collectives™ on Stack Overflow

jquery loop over input value and get sum

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related