Maintaining sort order and current page after dynamically updating column
Maintaining sort order and current page after dynamically updating column
![longpa](https://secure.gravatar.com/avatar/3da6ea8d5202dfc6205dc348a91c8bef/?default=https%3A%2F%2Fvanillicon.com%2F3da6ea8d5202dfc6205dc348a91c8bef_200.png&rating=g&size=120)
We have a table that is mostly static content except one column that is populated in repsnse to a async web call. This is the code to udate the datatable
signal.initialiseSignalCounts();
response.forEach((element) => {
// Get signal colum data from DatatablesJS
const signalColumn = 8;
let cell = table.cell('#row-' + element.patientId, signalColumn);
let signalStateCssClass = signal.getSignalCssClassFromState(element.state);
signal.incrementSignalCount(element.state);
const signalMarkup = `
<a class="btn ${signalStateCssClass} signal" href="/browse/${element.patientId}/signal">
${element.clinicianFriendlyStateName} (${DateTime.fromISO(element.stateStartDate).toLocal().toRelative()})
</a>
`;
// Update the DatatablesJS data with the new Signal State button
cell.data(cell.data() + signalMarkup);
let row = table.row('#row-' + element.patientId);
// Update DatatablesJS row with sorting info for Signal column
row.data()[signalColumn]['@data-sort'] = signal.getSignalSortValueFromSignal(element);
signal.updateCountPanelSignalCounts();
});
The trouble is that if the column the user is sorting is the one that we dynamically populate the sort is not reapplied. To fix this I am now reading the table.page()
before update then resetting that and calling draw
// Reset page
table.page(currentPageBeforeUpdatingSignal);
table.draw(false)
Does that all sound like the right thing to do?
Replies
Yes, that would be the correct way to do it. A call to
draw()
will trigger a resort.Allan
Thanks