DataTables

DataTables Examples

by mamounothman

HTML

<link rel="stylesheet" href="//cdn.datatables.net/1.10.0/css/jquery.dataTables.css">
<script src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.js"></script>
<table cellpadding="0" cellspacing="0" border="0" class="row-border" id="table">
<thead>
    <th>Video ID</th>
    <th>Filename</th>
    <th>Action</th>
</thead>
<tbody>
    <tr>
    <td>1</td>
    <td>ABCD</td>
        <td><input type='button' name='deleteBtn' value='Delete' /></td>
    </tr>
</tbody>
<tfoot>
    <tr>
        <th>Video ID</th>
        <th>Filename</th>
        <th>Action</th>
    </tr>
</tfoot>
</table>

JavaScript

//does not work
//var table = $('#table').dataTable();

//works
var table = $('#table').DataTable( {
        responsive: {
         breakpoints : [
              { name: 'tablet-l', width: 0 },
              { name: 'tablet-p', width: 0 },
              { name: 'mobile-l', width: 0 },
              { name: 'mobile-p', width: 0 }
          ]
        }
    });

$('#table tbody').on('click',"input[type='button']",function() {
    console.log(table.row($(this).parents('tr')));
                
    table
        .row( $(this).parents('tr'))
        .remove()
        .draw();
});