Request specific page on initial draw
Request specific page on initial draw
Before I spend hours trying to create a test case:
When returning to a url I want to restore to the previous display.
I have multiple tables and process only one and hide the others.
Therefore I have to manually request the draw.
The state data contains the proper 'start' and 'length' but the draw ignores it and goes to page 1.
I tried to force it with
table.page(2).draw('page');
but it ignores the page number and goes to page 1.
Any obvious reason why draw('page') would not go to the requested page?
$(document).ready(function () {
var table = $('#pr').DataTable({
"processing": true,
"serverSide": true,
"dom": "<'tbh'l<'prwhere'>f>rtip",
'deferLoading': 0,
"stateSave": true,
"stateDuration": -1,
"ajax": {
"url": "/shpr.php"
},
"pagingType": "input",
"columns": [
{
"className": 'dt-control',
"orderable": false,
"data": null,
"defaultContent": ''
},
{"name": 'name'},
{"name": 'skin'},
{"name": 'build'},
{"name": 'eyes'},
{"name": 'hair'},
{"name": 'bodyhair'},
{"name": 'facialhair'},
{"name": 'tattoo'},
{"name": 'piercing'}
],
columnDefs: [
{"targets": COLUMN0, "width": "9px"},
{"targets": COLUMN1, "className": "dt-body-nowrap"}
],
ordering: true,
order: [[COLUMN1, 'asc']],
lengthMenu: [25, 50, 100],
initComplete: function () {
// capture key up on column search fields
this.api().columns().every(function () {
$('input', this.footer()).on('keypress', function (ev) {
if (ev.keyCode === 13) { //only on enter keypress (code 13)
prSearchFields();
}
});
});
}
});
var state = table.state.loaded();
if (state) {
table.page(2).draw('page'); <=== just forcing it to see if it works.... it doesn't
} else {
table.draw();
}
});
Answers
That's likely an async issue - where it would get called before the Ajax request has been processed. You could try moving that paging code into
initComplete, or just initialise the table withdisplayStartto start on that second page.Colin
See if
stateSavedoes what you want.Kevin