通过产品交易实现数据表的最佳方法

时间:2019-04-16 02:44:13

标签: javascript jquery datatables

我正在尝试开发产品购买系统。列为:产品名称,价格,数量和总计。价格已经设置,如果数量发生变化,则子总价值将为价格乘以数量。使用DataTables.net,我想知道是否有一些API可以在行上的特定列发生更改时更新最后一行。

我尝试通过在HTML输入上使用onchange来对每行编号。我认为,DataTables已经为此提供了一个API,但我不知道该如何使用它。

<table id="data_tables">
  <thead>
    <tr>
      <th width="20%">Product Name</th>
      <th width="20%">Price</th>
      <th width="10%">Qty</th>
      <th width="20%">Sub Total</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <select class="form-control form-control-sm" id="product_1" name="product['name'][]" onchange="productChange('1')">
          <option value="1">Product 1</option>
          <option value="2">Product 2</option>
          <option value="3">Product 3</option>
        </select>
      </td>
      <td>
        <input type="text" class="form-control form-control-sm" id="price_1" name="product['price'][]" placeholder="Rp 0,-" readonly>
      </td>
      <td>
        <input type="number" class="form-control form-control-sm" id="qty_1" name="product['qty'][]" min="1" placeholder="0" onchange="qtyChange('1')">
      </td>
      <td>
        <input type="text" class="form-control form-control-sm" id="subtotal_1" name="product['total'][]" placeholder="Rp 0,-" readonly>
      </td>
    </tr>
  </tbody>
</table>
function qtyChange(id)
{
  var price = $('#price_'+id).val();
  var qty = $('#qty_'+id).val();
  $('#subtotal_'+id).val(price*qty);
}

该代码有效。但是DataTables是否具有自己的API来做到这一点?

0 个答案:

没有答案