使用javascript

Question

我在这里有一个示例来说明我的当前情况。

DEMO

我的问题是，当我复制行并更改值时，该项目的其他数量没有更改。就像复制监视器项目时，其数量总计为100，而我的第一个输入是50。复制的项目数量应更改。

图片显示了我正在努力实现的目标。红色表示当我更改授予的数量时，数量也应更改。但不幸的是，这并没有发生在我的代码中。

这是我的一些代码。

$('.awarded_qty').on("keyup", function() {


          var id = this.id;
          var num = id.split('-');

          var awarded_qty = $(this).val();
          var unit_price = $('#unit_price-'+num[1]).val();
          var new_rows = $('#supplier-table tbody tr.newClass').length;
          var orig = $('#orig-'+num[1]).val();


          if (awarded_qty != '') { $('#copy-'+num[1]).prop('disabled',false); }else{ $('#copy-'+num[1]).prop('disabled',true); }


          var aoq_id = $(this).data('aoq_id');
          var value = $(this).val();
          var sum = 0;
          $("#supplier-table .awarded_qty").filter(function(){ 
            if ($(this).data("aoq_id") == aoq_id){
              sum += parseFloat(value);
            }
          });
          // console.log(sum);
          $('#for_rem-'+num[1]).val(sum);


          if (unit_price != '' && new_rows == 0) {
              var tots = parseFloat(awarded_qty) * parseFloat(unit_price);
              var comma_tots = numberWithCommas(tots);
              $('#total-'+num[1]).val( comma_tots );

          }

          if (unit_price != '' && new_rows != 0) {
            var tots = parseFloat(awarded_qty) * parseFloat(unit_price);
            var comma_tots = numberWithCommas(tots);
            $('#total-'+num[1]).val( comma_tots );
          }






          qty_control(num[1]);
          if (unit_price != '' && $('#awarded_supplier-'+num[1]).val() != '' ) {

            refresh_index();

          }

      });

注意。键入时原始项目不得更改。仅复制项目的数量。

Answer 1

我认为您正在寻找的是这样的东西。为了使本示例更简洁，我删除了其他列和脚本。

function updateQuantities() {
  var sumOfAwarded = 0;
  $("#supplier-table tbody tr").each(function() {
  	var row = $(this);
  	var quantityInput = row.find(".qty");
    var quantity = parseInt(quantityInput.data("qty"));
    quantityInput.val(quantity - sumOfAwarded);
    
    var awardedQuantity = parseInt(row.find(".awarded_qty").val());
    awardedQuantity = isNaN(awardedQuantity) ? 0 : awardedQuantity;
    sumOfAwarded += awardedQuantity;
  });
}

$(function() {
  $(".qty").each(function(i, elm) {
  	$(elm).attr("data-qty", elm.value);
  });
  
  $(".awarded_qty").keyup(updateQuantities);
  updateQuantities();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="supplier-table">
  <thead>
    <tr>
      <th>Qty</th>
      <th>Awarded Quantity</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="text" class="qty" value="2000" readonly="readonly" /></td>
      <td><input type="text" class="awarded_qty" /></td>
    </tr>
    <tr>
      <td><input type="text" class="qty" value="2000" readonly="readonly" /></td>
      <td><input type="text" class="awarded_qty" /></td>
    </tr>
    <tr>
      <td><input type="text" class="qty" value="2000" readonly="readonly" /></td>
      <td><input type="text" class="awarded_qty" /></td>
    </tr>
  </tbody>
</table>