1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
<?xml version="1.0" encoding="UTF-8" ?>
<dt-option group="callback">
<name>initComplete</name>
<summary>Initialisation complete callback.</summary>
<since>1.10</since>
<type type="function">
<signature>initComplete( settings, json )</signature>
<parameter type="DataTables.Settings" name="settings">
DataTables settings object
</parameter>
<parameter type="object" name="json">
JSON data retrieved from the server if the `ajax` option was set. Otherwise `undefined`.
</parameter>
<scope>HTML table element</scope>
</type>
<description>
It can often be useful to know when your table has fully been initialised, data loaded and drawn, particularly when using an `dt-init ajax` data source. In such a case, the table will complete its initial run before the data has been loaded (Ajax is asynchronous after all!) so this callback is provided to let you know when the data is fully loaded.
Additionally the callback is passed in the JSON data received from the server when Ajax loading data, which can be useful for configuring components connected to your table, for example [Editor fields](//editor.datatables.net).
</description>
<example title="Show an alert when the table has fully loaded"><![CDATA[
$('#example').dataTable( {
"initComplete": function(settings, json) {
alert( 'DataTables has finished its initialisation.' );
}
} );
]]></example>
<example title="Show a loading message while the table is being initialised (`processing` will do this as well)"><![CDATA[
$('<div class="loading">Loading</div>').appendTo('body');
$('#example').dataTable( {
"initComplete": function( settings, json ) {
$('div.loading').remove();
}
} );
]]></example>
<related type="option">ajax</related>
<related type="option">drawCallback</related>
<related type="event">init</related>
</dt-option>
|
