Javascript вычисляет динамическую текстовую форму

Question

У меня есть код jquery для создания динамического текстового поля. Вот мой JQuery код:

var rowNum = 0; 
    function addRow(frm) { 
    rowNum ++; 
    var row = '<p id="rowNum'+rowNum+'">Tanggal: <input type="text" class="datepick" name="qty[]" id="date'+rowNum+'" value="'+frm.add_qty.value+'" readonly="readonly"> Harga: <input type="text" name="name[]" value="'+frm.add_name.value+'" readonly="readonly"> <input type="button" value="Remove" onclick="removeRow('+rowNum+');"></p>'; 
    jQuery('#itemRows').append(row); 
    frm.add_qty.value = ''; 
    frm.add_name.value = ''; 
    } 

    function removeRow(rnum) { 
    jQuery('#rowNum'+rnum).remove(); 
    } 

и вот мой код формы:

<div class="form-group"> 
    <label>Price Given</label> 
     <div id="itemRows">         
     <label class="strong">Date: <input type="text" name="add_qty" class="datepick" id="date[]" /> 
     Price: <input type="text" name="add_name" /> 
     <input onclick="addRow(this.form);" type="button" value="Add" /> 
    </div> 
    </div> 
<div class="form-group"> 
    <label>Total</label> 
     <input type="text" class="form-control" name="total" id="total" /> 
    <button type="button" name="calculate">Calculate</button> 
</div> 

Моя проблема в том, как создать свой текстовое поле «всего» может автоматически или можно вычислить (нажав кнопку Calculate) общее текстового поля 'add_name' (цена)? Надеюсь, есть простой и простой способ сделать это.

Answer 1

Пожалуйста, попробуйте этот код

$(document).ready(function(){ 
     $("input[type='text'][name='add_name']").change(function(){ 
      var sum = 0 
      $("input[type='text'][name='add_name']").each(function(){ 
       sum = sum + parseInt($(this).val()); 
      }); 
      $("input[type='text'][name='total']").val(sum); 
     }); 
    }); 

DEMO

Answer 2

попробовать это.

$('[name="calculate"]').on('click', function() { 
    var sum = 0; 
    $('[name="add_name"]').each(function() { 
     sum += $(this).val(); 
    }) 
    $('#total').val(sum); 
})