File
Add library
Share
Login or Register
Help
HTML
 
<!DOCTYPE html>
<html>
  <head>
    <script src="https://code.jquery.com/jquery-3.6.3.js"></script>
​
    <link href="https://nightly.datatables.net/css/dataTables.dataTables.css" rel="stylesheet" type="text/css" />
    <script src="https://nightly.datatables.net/js/dataTables.js"></script>
<link href="https://cdn.datatables.net/select/2.0.1/css/select.dataTables.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.datatables.net/select/2.0.1/js/dataTables.select.js"></script>
​
    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
  </head>
  <body>
    <div class="container">
      <button id="btnRight">Get selected rows</button>
      <table id="example" class="display" width="100%">
        <thead>
          <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Extn.</th>
            <th>Start date</th>
            <th>Salary</th>
          </tr>
        </thead>
​
        <tfoot>
          <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Extn.</th>
            <th>Start date</th>
            <th>Salary</th>
          </tr>
        </tfoot>
      </table>
    </div>
  </body>
</html>
JavaScript
 
function LoadTableExclude() {
  return $('#example').DataTable({
    processing: true,
    serverSide: true,
    ajax: {
      url: '/ssp/objects.php',
      type: 'post'
    },
    columns: [
      { data: 'first_name' },
      { data: 'last_name' },
      { data: 'position' },
      { data: 'office' },
      { data: 'start_date' },
      { data: 'salary' },
    ],
    select: {
      style: 'multi'
    },
  });
}
​
var excludeTable = LoadTableExclude();
 
$('#btnRight').click(function () {
      var selectedRows = excludeTable.rows({ selected: true }).data().toArray(); // here i am getting "undefined"
      alert(selectedRows.length + ' rows selected');
//       var ids = selectedRows.map(row => row.siteCode); // siteCode is the id value of the data object
​
//       if (ids.length === 0) {
//       alert("Please select rows to move.");
//       return;
//       }
}); // I always get "Please select row to move" message.
Output 300px

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers