Stale data on draw()

sweoggy

I have a datatable which gets its rows data from an AJAX call. One of the columns contains a cell which needs a further AJAX call which returns an HTML string which should be replace the cell's current content. The code look as follows:

$nextAjaxCell.replaceWith(content)
$table.cell($cell).invalidate("dom")
$table.cell($cell).invalidate()
$table.cell($cell).invalidate("data")
loadAjaxHasBeenCalled = false
exports.loadNextAjaxCell($parent)

But if I then call draw $(e).DataTable().columns.adjust().draw("page") the cells with the second AJAX call will be reset back to the data received from the first AJAX call.

I tried to use $table.cell($cell).data(content) instead of $nextAjaxCell.replaceWith(content), but to no avail.

How can I invalidate/change the underlying data so the data from second AJAX call persists after draw().

kthorngren

Sounds like $cell might not be the correct selector for the cell. Have you verified it is correct? What code are you using to assign $cell?

Kevin

sweoggy

I assign the cell like so: const $cell = $nextAjaxCell.closest("td") (In other words, it is a jQuery object)

It works to set the data using the $table.cell($cell) function, so I guess it's the right selector, but I am not sure.

kthorngren

It works to set the data using the $table.cell($cell)

You mentioned this does not work:
$table.cell($cell).data(content)

if I then call draw $(e).DataTable().columns.adjust().draw("page") the cells with the second AJAX call will be reset back to the data received from the first AJAX call.

Are you using server side processing (serverSide is true)?

In this example I can update the clicked cell without using draw().
http://live.datatables.net/divawadu/1/edit

Maybe you can provide a link to your page or a test case replicating the issue. Seeing what you are doing will help us to help you.

Kevin