DataTables

DataTables Examples

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>
								<tr>
									<th class="sortable-text">Pallet</th>
								</tr>
							</thead>
							<tbody>
								<tr class="odd">
									<td>0012321300023526243534503143</td>
								</tr>
								<tr class="even">
									<td>0012321300023526243534503182</td>
								</tr>
								<tr class="odd">
									<td>0012321300023526243534503163</td>
								</tr>
								<tr class="even">
									<td>0012321300023526243534503227</td>
								</tr>
								<tr class="odd">
									<td>0012321300023526243534503525</td>
								</tr>
								<tr class="even">
									<td>0012321300023526243534503774</td>
								</tr>
								<tr class="odd">
									<td>0012321300023526243534503248</td>
								</tr>
								<tr class="even">
									<td>0012321300023526243534503162</td>
								</tr>
								<tr class="odd">
									<td>0012321300023526243534503290</td>
								</tr>
								<tr class="even">
									<td>0012321300023526243534503549</td>
								</tr>
								<tr class="odd">
									<td>0012321300023526243534503552</td>
								</tr>
								<tr class="even">
									<td>001232130002352624353450350</td>
								</tr>
								<tr class="odd">
									<td>0012321300023526243534503943</td>
								</tr>
								<tr class="even">
									<td>0012321300023526243534503329</td>
								</tr>
								<tr class="odd">
									<td>0012321300023526243534503863</td>
								</tr>
								<tr class="even">
									<td>0012321300023526243534503126</td>
								</tr>
								<tr class="odd">
									<td>0012321300023526243534503884</td>
								</tr>
								<tr class="even">
									<td>0012321300023526243534503545</td>
								</tr>
								<tr...

JavaScript

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

//works



var table = $('#table').DataTable({
pageLength: -1,
    columnDefs: [
      {
        targets: 0,
        type: 'string',
        render: function (data, type, row) {
        	if (type === 'sort' ) {
          	return data.padStart(28, "0");
          }
          return data;
        }
      }
    ]

});
console.log('Column 0 type: ', table.settings()[0].aoColumns[0].type)

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