2014-12-05 141 views
0

我有input fieldproductquantitytotal_quantity一个形式是可能的,一旦用户输入在quantity field的总量产物的总量,回声在total_quantity field回声甚至形式并不提交

我创建一个小提琴here

例如

product name | quantity

product 1 | 2

product 2 | 3

============================

Total Quantity | 5

5必须出现在总quantity input field

回答

2

jQuery(function($) { 
 
    $('input.more').on('click', function() { 
 
    var $table = $('#input_fields'); 
 
    var $tr = $table.find('tr').eq(0).clone(); 
 
    $tr.appendTo($table).find('input').val(''); 
 
    }); 
 

 
    $("#quick_post").each(function() { 
 
    var form = $(this); 
 

 
    form.on('keyup', '.orderquan', function() { 
 
     var sum = 0; 
 
     form.find('.orderquan').each(function() { 
 
     sum += +this.value; 
 
     }); 
 

 
     form.find(".total-quan").val(sum); 
 
    }); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="quick_post" method="post"> 
 
    <table id="input_fields"> 
 
    <tr> 
 
     <td> 
 
     <input class="orderinput" type="text" name="product[]" /> 
 
     </td> 
 
     <td> 
 
     <input class="orderquan" type="text" name="quantity[]" size="1" maxlength="3" /> 
 
     </td> 
 
    </tr> 
 
    </table> 
 
    <p> 
 
    <label>Total Quantity</label> 
 
    <input name="total_Quantity" class="total-quan" value="" /> 
 
    </p> 
 
</form> 
 

 
<input class="more" type="button" value="Addmore" name="addmore" />

+0

感谢这个答案的方式我的''是'array'形式还有其他方法可以搭上它,因为'array'中没有任何工作形式,对不起,如果我不提及它。 – jhunlio 2014-12-05 01:04:17

+0

顺便说一句,我有这个jQuery,所以我可以生成更多的输入字段http://jsfiddle.net/gtWu3/ – jhunlio 2014-12-05 01:13:44

+2

看到更新的答案 – Neverever 2014-12-05 01:24:43