draw() question... expecting different results

mihomes

Basically, this is just a way to show user messages inside the datatable based off ajax responses. Say I have a successful response... in ajax I am then inserting 'TEST' into #dtAlert. This works perfectly fine.

I then decided to make sure the alerts were cleared every time there was a draw on the table. This is where the drawCallback portion comes into play which clears the message.

The problem is my alert shows briefly then is cleared. Shouldn't draw() and its callback occur before anything I do after it?

I expect the order to be :

dt.draw(); (redraw table)
$("#dtAlert").html(''); (the callback)
$("#dtAlert").html('TEST'); (my message)

,however, the way it performs is more like :

dt.draw(); (redraw table)
$("#dtAlert").html('TEST'); (my message)
$("#dtAlert").html(''); (the callback)


Here is a short example with what I am talking about :

[code]
dt = $('#datatable').DataTable({
"dom": "<'row'<'col-sm-6'l><'col-sm-6'f>><'row'<'col-md-12 col-sm-12 text-center'r>><'row'<'col-sm-12'<'#dtButtons'>>><'row'<'col-sm-12'<'#dtAlert'>>><'table-scrollable't><'row'<'col-md-5 col-sm-12'i><'col-md-7 col-sm-12'p>>",
"drawCallback": function() {
$("#dtAlert").html('');
}
});
[/code]

inside an ajax response I am doing the following :

[code]
dt.draw();
$("#dtAlert").html('TEST');
[/code]

allan

Yes apart from one thing - you've forgotten what the 'A' in Ajax stands for :-). The code sample above will operate as you expect, but it s synchronous. Ajax is asynchronous!

You probably want to listen for the `draw` event to occur for your display: http://next.datatables.net/reference/event/draw

Allan