每当添加新行时,是否需要jQuery Datatables滚动到底部

时间:2019-02-27 08:45:58

标签: jquery html

每当添加一行时,我都希望DataTable滚动到底部。

建议我如何解决问题。或数据表滚动条固定在底部

<table id="table_transaction" class="table  table-bordered table-hover ">
  <thead>
    <tr class="tableheader" style="width:40px;color:white;background-color:#00bcd4;">
      <th style="width:40px">#</th>
      <th style="width:250px">PART NAME</th>
      <th style="width:120px">UNIT PRICE</th>
      <th style="width:40px" class='columnQty'>DISCOUNT</th>
      <th style="width:60px" class='columnQty'>Qty</th>
      <th style="width:40px" class='columnQty'>GST</th>
      <th style="width:40px" class='columnQty'>GST AMT</th>
      <th style="width:120px">Total</th>
      <th style="width:100px">MRP</th>
      <th style="width:px">DELETE</th>
    </tr>
  </thead>
  <tbody></tbody>
</table>
function init_data() {
  var value = {
    method: "getdata"
  };

  var table = $('#table_transaction').DataTable({
    "scrollY": "200px",
    "scrollCollapse": true,
    "paging": false,
    "lengthChange": false,
    "searching": false,
    "ordering": false,
    "info": false,
    "responsive": true,
    "autoWidth": false,
    "pageLength": 50,
    "dom": '<"top"f>rtip',
    "columnDefs": [{
      className: "textright",
      "targets": [4, 5, 6]
    }],
    "ajax": {
      "url": "c_pos.php",
      "type": "POST",
      "data": value,
    },
    "columns": [{
      "data": "urutan"
    }, {
      "data": "item_name"
    }, {
      "data": "unitPrice"
    }, {
      "data": "discount"
    }, {
      "data": "qty"
    }, {
      "data": "gstPer"
    }, {
      "data": "gstAmt"
    }, {
      "data": "subtotal"
    }, {
      "data": "nonDiscMrp"
    }, {
      "data": "button"
    }, ]
  });

  var $scrollToBottom = $(table.table().node()).parent();
  $scrollToBottom.scrollTop($scrollToBottom.get(0).scrollHeight);
  refresh_total();
  set_focus("#customerName");
  newkdtrans();
}

0 个答案:

没有答案