Since: DataTables 1.10

Draw event - fired once the table has completed a draw.


It can be useful to take an action on every draw event of the table - for example you might want to update an external control with the newly displayed data, or when server-side processing enabled you might want to assign events to the newly created elements. This event is available to give exactly this information.

The draw event is fired whenever the table is redrawn on the page, at the same point as drawCallback (technically the callback fires before the event, but they occur sequentially and thus either can be used to achieve the same effect).

Please note that, as with all DataTables emitted events, the event object has a DataTables API instance available on it (the first parameter). Additionally, the events are triggered with the dt namespace. As such, to listen for this event using jQuery directly, you must also use the dt namespace by simply appending .dt to your event name. The DataTables on() method does this automatically.

This event will bubble up the document, so you can add a listener for draw.dt to the body to capture all draw events triggered by DataTables.


function function( e, settings )



Log to console on each draw:

var table = new DataTable('#myTable');

table.on('draw', function () {
	console.log('Redraw occurred at: ' + new Date().getTime());


The following options are directly related and may also be useful in your application development.