2013-06-06 19 views
5

Chcę utworzyć formularz, w którym mam 7 pól wejściowych, w których wprowadzam liczby i jedno ostatnie pole wejściowe, w którym wszystkie wstawione liczby są sumowane w jednym wyniku. Próbowałem edytować skrypt z innego układacza, ale z jakiegoś powodu nie wyświetla on wyniku.jquery suma wielu pól wejściowych w jednym

html jest:

<form class="form-horizontal" id="whereEntry" method='post' action=''> 
    <fieldset> 
    <input type="text" class="income_count span1 register_input" id="income" name="income" placeholder="% of income"> <br> 
    <input type="text" class="income_count span1 register_input" id="income_2" name="income_2" placeholder="% of income"> <br> 
<input type="text" class="income_count span1 register_input" id="income_3" name="income_3" placeholder="% of income"> <br> 
<input type="text" class="income_count span1 register_input" id="income_4" name="income_4" placeholder="% of income"> <br> 
    <input type="text" class="income_count span1 register_input" id="income_5" name="income_5" placeholder="% of income"> <br> 
     <input type="text" class="income_count span1 register_input" id="income_6" name="income_6" placeholder="% of income"> <br><br><br> 

    <input type="text" class="span2 register_input" id="income_sum" name="income_sum" placeholder="% of income"> <br> 
     </fieldset> 
     </form> 

i mój skrypt do tej pory wygląda następująco:

var $form = $('#whereEntry'), 
$summands = $form.find('.income_count'), 
$sumDisplay = $('#income_sum'); 

$form.delegate('.income_count', 'change', function() 
{ 
var sum = 0; 
$summands.each(function() 
{ 
    var value = Number($(this).val()); 
    if (!isNaN(value)) sum += value; 
}); 

$sumDisplay.text(sum); 
}); 

tu jsfiddle niego: http://jsfiddle.net/bT4nm/1/

mógłbyś mi pomóc? jest problem w moich klasach html lub coś w skrypcie jestem Nooby o jQuery i trzeba jak najszybciej rozwiązanie .. zmiana moich js skrzypce byłoby świetnie

+0

Po prawidłowym zsumowaniu liczb, możesz mieć problemy z wyświetlaniem sumy w prawidłowym formacie (separatory tysięcy, miejsca dziesiętne, symbol waluty itp.). Zobacz tę odpowiedź, aby uzyskać pomoc: http://stackoverflow.com/questions/2901102/how-to-print-a-number- with-commas-as-thousands-separators-in-javascript/28378652#28378652 – gibberish

Odpowiedz

5

Użyj tego:

var $form = $('#whereEntry'), 
$summands = $form.find('.income_count'), 
$sumDisplay = $('#income_sum'); 

$form.delegate('.income_count', 'change', function() 
{ 
var sum = 0; 
$summands.each(function() 
{ 
    var value = Number($(this).val()); 
    if (!isNaN(value)) sum += value; 
}); 

$sumDisplay.val(sum); 
}); 
+0

dzięki również ! :) – dzordz