Cara mengambil data dari baris datatable

Cara mengambil data dari baris datatable

Cara mengambil data dari baris datatable

kami membagikan tutorial Cara mengambil data dari baris datatable mudah mudahan bermanfaat buat yang sedang mengerjakan project dan membutuhkan fitur ini pada datatablenya, semoga bermanfaat.

buat yang butuh demo disini demonya

Kode HTML

berikut kode html nya

<button id="btnSelectedRows">
  Tampilkan Value
</button>

<table id="example" class="display" cellspacing="0" width="100%">
  <thead>
    <tr>
      <th></th> <!-- this th is for checkbox-->
      <th>Product Name</th>
      <th class="cell-300" scope="col" data-tablesaw-sortable-col data-tablesaw-priority="4">Product Unit</th>
      <th class="cell-300" scope="col" data-tablesaw-sortable-col data-tablesaw-priority="4">Product MRP</th>
      <th class="cell-300" scope="col" data-tablesaw-sortable-col data-tablesaw-priority="4">Selling Price</th>
      <th class="cell-300" scope="col" data-tablesaw-sortable-col data-tablesaw-priority="4">Buying Price</th>
      <th></th> <!-- this th is for product status-->
    </tr>
  </thead>

  <tr id="C01P01">
    <td></td><!-- this td is for checkbox-->
    <td>Name 1</td>
    <td>1 Kg</td>
    <td tabindex="1">50</td>
    <td tabindex="2">100</td>
    <td tabindex="3">150</td>
    <td class="productStatus">true</td><!-- this td is for product status which is hidden-->
  </tr>

  <tr id="C01P02">
    <td></td><!-- this td is for checkbox-->
    <td>Name 2</td>
    <td>1 Kg</td>
    <td tabindex="1">50</td>
    <td tabindex="2">100</td>
    <td tabindex="3">150</td>
    <td class="productStatus">true</td><!-- this td is for product status which is hidden-->
  </tr>

  <tr id="C01P03">
    <td></td>
    <td>Name 3</td>
    <td>1 Kg</td>
    <td tabindex="1">50</td>
    <td tabindex="2">100</td>
    <td tabindex="3">150</td>
    <td class="productStatus">false</td>
  </tr>

  <tr id="C01P04">
    <td></td>
    <td>Name 4</td>
    <td>1 Kg</td>
    <td tabindex="1">50</td>
    <td tabindex="2">100</td>
    <td tabindex="3">150</td>
    <td class="productStatus">true</td>
  </tr>

  <tr id="C01P05">
    <td></td>
    <td>Name 5</td>
    <td>1 Kg</td>
    <td tabindex="1">50</td>
    <td tabindex="2">100</td>
    <td tabindex="3">150</td>
    <td class="productStatus">true</td>
  </tr>
</table>

Kode Javascript

lalu kode javascriptnya

var table;
$(document).ready(function() {
  table = $('#example').DataTable({
    columnDefs: [{
      orderable: false,
      className: 'select-checkbox',
      targets: 0
    }, {
      "targets": 6, 
      "visible": false,
      "searchable": false
    }],
    select: {
      style: 'os',
      selector: 'td:first-child'
    },
    order: [
      [1, 'asc']
    ]
  });
});

$('#btnSelectedRows').on('click', function() {

  $.each(table.rows('.selected').nodes(), function(i, item) {
    var id = item.id;
    var data = table.row(this).data();

    alert("Produt Id : " +
      id + " && product Status:  " + data[6]);
  });
})

 

Tinggalkan Komentar

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Need Help? Chat with us