php - jQuery仅获取最后一行的值

我正在使用MySQL检索“库存”数据

        <table class="table table-striped table-bordered table-hover results table-fixed">
          <thead>
            <tr>
                <th class="text-center">#</th>
                <th>Product Name</th>
                <th>Description</th>
                <th>Price</th>
                <th>In Stock</th>
                <th style="width: 20%">Quantity</th>
            </tr>
            <tr class="warning no-result">
              <td colspan="8"><i class="fa fa-warning"></i> No Product Found</td>
            </tr>
          </thead>

          <tbody>

            <?php
                $query = "SELECT * FROM products";
                $exec = mysqli_query($connection, $query);

                while ($row = mysqli_fetch_array($exec)) {

                  $product_id = $row['product_id'];
                  $product_name = $row['product_name'];
                  $description = $row['description'];
                  $product_quantity = $row['quantity'];
                  $product_price = $row['sell_price'];
            ?>

            <tr>
                <td class="text-center"><?php echo $product_id; ?>
                  <input type="hidden" name="product_id[]" value="<?php echo $product_id; ?>">
                </td>
                       <td><?php echo $product_name; ?></td>
                       <td><?php echo $description; ?></td>
                       <td><?php echo $product_price; ?></td>
                       <td><input type="number" value="<?php echo $product_quantity; ?>" id="qtyResult" disabled></td>
                      <td><input type="number" name="qtyBuy[]" id="qtyBuy" onkeyup="updateStock()"></td>
            </tr>

            <?php } ?>

        </tbody>
      </table>

我要在数量字段中键入数字时自动更新“库存”字段。

“ San Mig Light的”库存为500，但是当我在“数量”字段中键入数字时，库存更改为表上的最后一条记录，即45。

除第一个行外，其余行均不起作用。

这是我的jQuery脚本。

<script>

  function updateStock() {
     var inputQty = $('#qtyBuy').val();
     var inStock = "<?php echo $product_quantity; ?>"
    $('#qtyResult').val(inStock - inputQty);
   }

 </script>

Table

最佳答案

尝试将this和event关键字传递给您的函数，例如：

<td><input type="number" name="qtyBuy[]" id="qtyBuy" onkeyup="updateStock(this, event)"></td>

由于该ID必须是唯一的，因此请尝试输入一个数字，例如：qtyBuy1，qtyBuy2 ...

要选择这些字段，您可以：find（'input [id ^ =“ qtyResult”]'）：选择输入字段，其中id以字符串“ qtyResult”开头。

因此，在updateStock中，您可以使用参数来引用当前值，例如：

    function updateStock(obj, event) {
        var inputQty = obj.value;
        var inStock = "<?php echo $product_quantity; ?>";
        $(obj).closest('tr').find('input[id^="qtyResult"]').val(inStock - inputQty);
    }

片段：

function updateStock(obj, event) {
  var inputQty = obj.value;
  var inStock = $(obj).closest('tr').find('input[id^="qtyResult"]').val();
  var av = $(obj).closest('tr').find('input[id^="qtyResult"]').data('savedValue');
  if (av == undefined) {
    $(obj).closest('tr').find('input[id^="qtyResult"]').data('savedValue', inStock);
    av = inStock;
  }
  inStock = av;
  console.log(av + ' / ' + inStock + ' / ' + inputQty);
  $(obj).closest('tr').find('input[id^="qtyResult"]').val(inStock - inputQty);
}

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

<table class="table table-striped table-bordered table-hover results table-fixed">
    <thead>
    <tr>
        <th class="text-center">#</th>
        <th>Product Name</th>
        <th>Description</th>
        <th>Price</th>
        <th>In Stock</th>
        <th style="width: 20%">Quantity</th>
    </tr>
    <tr class="warning no-result">
        <td colspan="8"><i class="fa fa-warning"></i> No Product Found</td>
    </tr>
    </thead>

    <tbody>
    <tr>
        <td class="text-center">product_id1
            <input type="hidden" name="product_id[]" value="1">
        </td>
        <td>product name1</td>
        <td>description1</td>
        <td>product_price1</td>
        <td><input type="number" value="1" id="qtyResult1" disabled></td>
        <td><input type="number" name="qtyBuy[]" id="qtyBuy1" onkeyup="updateStock(this, event)"></td>
    </tr>
    <tr>
        <td class="text-center">product_id2
            <input type="hidden" name="product_id[]" value="<?php echo $product_id; ?>">
        </td>
        <td>product_name2</td>
        <td>description2</td>
        <td>product_price2</td>
        <td><input type="number" value="1" id="qtyResult2" disabled></td>
        <td><input type="number" name="qtyBuy[]" id="qtyBuy2" onkeyup="updateStock(this, event)"></td>
    </tr>
    </tbody>
</table>