javascript - How to sum selected rows in table using jQuery? -

there table

sum | <input type="text"> | <input type="text"> |     | <input type="text"> | <input type="text"> |     | <input type="text"> | <input type="text"> | sum | <input type="text"> | <input type="text"> |     | <input type="text"> | <input type="text"> | foo | <input type="text"> | <input type="text"> | bar | <input type="text"> | <input type="text"> | 

i want sum of columns below "sum row" when input value changed. if there other column ex foo bar shouldn't count sum.

what aproach here? dummy idea: every column has reference value summed.

fiddle quick start: http://jsfiddle.net/igos/vnxzu/

edit should sum till next sum row right.

row 0 col 0  = row 1 col 0  + row 2 col 0 row 0 col 1  = row 1 col 1  + row 2 col 1 row 3 col 0  = row 4 col 0 row 3 col 1  = row 4 col 1 

it should dynamic, when more rows come automatically add more rows.

try

$('tr.sumtoup input').change(function(){     var $this = $(this), $row = $this.closest('tr'), $sum = $row.prevall('.sumtome').first(), $rows = $sum.nextuntil('.sumtome', '.sumtoup'), index = $this.closest('td').index();      var sum = 0;     $rows.each(function(){         var val = $(this).find('td').eq(index).find('input').val();         sum += (+val);     })     $sum.find('td').eq(index).find('input').val(sum); }); 

demo: fiddle