Inline edit causes redraw hang
Inline edit causes redraw hang
Hi all,
I have a DataTable with Editor and use inline edit to update one field. The datatable is defined as following:
g_purchase_orders_table = $('#purchase_orders').DataTable({
dom: 'lrBtip',
ajax: {
url: '/api/v1/admin/purchase/order',
error: xhr => { modal('No purchase orders', xhr.responseText) },
dataSrc: 'data'
},
rowId: 'id',
...
$('#purchase_orders').on( 'click', 'td.editable', function (e) {
g_edit_editor.inline(this, { submitOnBlur: true});
});
The editor is defined as following:
g_edit_editor = new $.fn.dataTable.Editor({
ajax: {
url: '/api/v1/admin/purchase/order/_id_',
contentType: 'application/json',
data: d => JSON.stringify(Object.entries(d.data)[0][1]),
error: (xhr, _e, _a) => {
modal("Purchase Order update failure", xhr.responseText);
}
},
...
The problem is that after the update of the field in the table the table is redrawn and "Processing" banner remains there forever. In the network debugger I saw 2 HTTP requests:
- POST for the record update. It ends with HTTP 200 status and the data looks like this:
{
"data": [ { object } ]
}
- GET for the table redraw. It ends with HTTP 200 status and the data looks like this:
{
"data": [
{ object },
{ object },
{ object },
...
]
}
If I set editor with drawType: 'none'
, the problem is gone. But the record isn't then redrawn and fnCreatedCell
function isn't called.
g_edit_editor.inline(this, { submitOnBlur: true, drawType: 'none'});
What could it be?
Answers
You don't have
serverSide
enabled and there is nothing else in the code above to cause a reload, so that shouldn't be happening. There is something else going on here that I'm not sure about it.Could you give me a link to your page so I can debug and trace it please?
Thanks,
Allan
Hi @allan ,
thank you for the response.
Unfortunately I have no public instance yet so I can't show it.
Should it be enabled in inline initializer? I have it enabled in DataTable definition. I thought it's only place it belongs