通过计算在bootsrap中添加行-逐行计算

时间:2019-12-11 01:39:29

标签: javascript php bootstrap-4 jscript web-development-server

Here is my UI

我想问我如何获得

的小计

fullpayment * penalty = answer + fullpayment =小计

和全额付款*折扣=答案-全额付款=小计

或同时执行并自动计算。

我只是编程的新手,希望有人可以帮助我,我有一段代码,但运行得并不理想。预先感谢您的帮助!

代码如下:

<tbody>
<td><input type="text" id='fpay0' name='fullpay[]' class="form-control fpay payment"/></td>
<td><input type="text" id='penalty0' name='penalty[]' class="form-control penalty payment"></td>
<td><input type="text" id='discount0' name='discount[]' class="form-control discount payment"></td>
<td><input type="text" name='subtotal[]' class="form-control numeric_value0 subtotal"></td>
</tbody>
<tfooter>
<td><input type="text" id="total" name="grandtotal" class="form-control"readonly></td>
</tfooter>
<script>    
    $(document).ready(function(){
        var i=1;
    $("#add_row").click(function(){
      $('#addr'+i).html("<td>"+ (i+1) +"</td><td><select class='form-control show-tick' name='classi[]"+i+"' required><option value=''>-- Please select --</option><option value='Agri'>Agri</option><option value='Resi - Bldg'>Resi - Bldg</option><option value='Resi - Lot'>Resi - Lot</option><option value='Comm'>Comm</option><option value='Indtl'>Indtl</option></select></td><td><select class='form-control show-tick' name='brgy[]"+i+"' required><option value=''>-- Please select --</option><option value='BALLUAY'>BALLUAY</option><option value='BAGONG'>BAGONG</option><option value='BANANGAN'>BANANGAN</option><option value='BANENGBENG'>BANENGBENG</option><option value='BAYABAS'>BAYABAS</option><option value='PAPPA'>PAPPA</option><option value='KAMOG'>KAMOG</option><option value='POBLACION'>POBLACION</option></select></td><td><input name='year[]"+i+"' type='text' class='form-control input-md' required></td><td><input name='nameown[]"+i+"' type='text' class='form-control input-md' required></td><td><input name='location[]"+i+"' type='text' class='form-control input-md'></td><td><input name='taxdecno[]"+i+"' type='text' class='form-control input-md'></td><td><input name='avland[]"+i+"' type='text' class='form-control input-md'></td><td><input name='avtotal[]"+i+"' type='text' class='form-control input-md'></td><td><input name='taxdue[]"+i+"' type='text' class='form-control input-md'></td><td><select class='form-control show-tick' name='insno[]"+i+"' required><option value=''>-- Please select --</option><option value='1st Qtr'>1st Qtr</option><option value='2nd Qtr'>2nd Qtr</option><option value='3rd Qtr'>3rd Qtr</option><option value='4th Qtr'>4th Qtr</option><option value='Ja-June'>Ja-June</option><option value='July-Dec'>July-Dec</option><option value='Annual'>Annual</option></select></td><td><input name='fullpay[]"+i+"' id='fpay"+i+"' type='text' class='form-control input-md fpays paym'></td><td><input name='penalty[]"+i+"' id='penalty"+i+"' type='text' class='form-control input-md penalty paym'></td><td><input  name='discount[]"+i+"' id='discount"+i+"' type='text' class='form-control input-md discount paym'></td><td><input  name='subtotal[]"+i+"' type='text' class='form-control numeric_value"+i+" subtotal'></td>");

      $('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>');
      i++; 
       $('.numeric_value').keyup(function() {
            var sum = 0;
            $('.numeric_value').each(function() {

                 sum += Number($(this).val());

            });
            sums = sums*2;
            $('#total').val(sum.toFixed(2));
            $('#tes').val(combines($('#total').val()));
    });

    $('.paym').change(function() {
                var sum = 0;
                for(var x=0;x<$('.fpays').length;x++){
                    var y = Number(x)+1;
                    var f = $('#fpay'+y).val();
                    var p = $('#penalty'+y).val(); 
                    var d = $('#discount'+y).val(); 
                    sum = Number(f) + Number(p) - d;
                    $('.numeric_value'+y).val(sum.toFixed(2));
                }
                var sums = 0;
                $('.subtotal').each(function() {

                 sums += Number($(this).val());

                });
                sums = sums*2;
                $('#total').val(sums.toFixed(2));
                $('#tes').val(combines($('#total').val()));
        });

    });

    $('.payment').change(function() {
        var sum = 0;
            var f = $('#fpay0').val();
            var p = $('#penalty0').val(); 
            var d = $('#discount0').val(); 
            sum = Number(f) + Number(p) - d;
            $('.numeric_value0').val(sum.toFixed(2));
            var sums = 0;
            $('.subtotal').each(function() {

                 sums += Number($(this).val());

            });
            sums = sums*2;
            $('#total').val(sums.toFixed(2));
            $('#tes').val(combines($('#total').val()));

    });


     $("#delete_row").click(function(){
         if(i>1){
         $("#addr"+(i-1)).html('');
         i--;
         }
     });

    });
    </script>

0 个答案:

没有答案