Я пытаюсь сохранить состояние отображения записей в таблице данных, но я не могу, я попытался использовать stateSave: true, и он работает для сохранения состояния для всего в таблице данных, но в моем случае я просто хочу сохранить состояние для количество записей для отображения в таблице.
Вот мой полный код:
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="../style.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<body>
<div class="content">
<table id="dt-filter-select" class="display compact" cellspacing="0" width="100%">
<thead>
<tr>
<th>Dev.no</th>
<th>IMEI</th>
<th>Serial no.</th>
<th>Barcode</th>
<th>Device</th>
<th>Date added on stock</th>
<th>Client</th>
<th>Sales date</th>
</tr>
</thead>
<tbody>
<?php if (!empty($devices)) { ?>
<?php foreach ($devices as $device) : ?>
<tr>
<td>
<?php echo $device["device_no"] ?>
</td>
<td>
<?php echo $device["serial_imei"] ?>
</td>
<td>
<?php echo $device["serial_no"] ?>
</td>
<td>
<?php echo $device["barcode"] ?>
</td>
<td>
<?php echo $device["dev_name"] ?>
</td>
<td>
<?php echo $device["created_date"] ?>
</td>
<td>
<?php echo $device["name"] ?>
</td>
<td>
<?php echo $device["sales_date"] ?>
</td>
</tr>
<?php endforeach; ?>
<?php } ?>
</tbody>
<tfoot>
<tr>
<th>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
<th>
</th>
</tr>
</tfoot>
</table>
</div>
<script>
$(document).ready(function() {
$('#dt-filter-select').dataTable({
initComplete: function() {
stateSave: true,
this.api().columns().every(function() {
var column = this;
var select = $('<select class="browser-default custom-select form-control-sm"><option value="" selected>Filter</option></select>')
.appendTo($(column.footer()).empty())
.on('change', function() {
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search(val ? '^' + val + '$' : '', true, false)
.draw();
});
column.data().unique().sort().each(function(d, j) {
select.append('<option value="' + d + '">' + d + '</option>')
});
});
}
});
});
</script>
</body>