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 46 47 48 49 50 51 52 53 54 55 56 57 58
|
<?xml version="1.0" encoding="UTF-8" ?>
<dt-api group="core">
<name>draw()</name>
<summary>Redraw the table.</summary>
<since>1.10</since>
<type type="function">
<signature>draw( [paging] )</signature>
<description>Redraw the DataTables in the current context, optionally updating ordering, searching and paging as required.</description>
<parameter type="boolean|string" name="paging" default="true">
<![CDATA[
This parameter is used to determine what kind of draw DataTables will perform. There are three options available (note that the string options require DataTables 1.10.8 or newer):
* `-string full-reset` or `true` (default) - the ordering and search will be recalculated and the rows redrawn in their new positions. The paging will be reset back to the first page.
* `-string full-hold` or `false` - the ordering and search will be recalculated and the rows redrawn in their new positions. The paging will **not** be reset - i.e. the current page will still be shown.
* `-string page` - ordering and search will not be updated and the paging position held where is was. This is useful for paging (i.e. `dt-api page()`) when data has not been changed between draws.
Please note that the string options require <span class="since">DataTables 1.10.8</span> or newer. Previous versions support only the boolean option.
]]>
</parameter>
<returns type="DataTables.Api">DataTables API instance</returns>
</type>
<description>
When you perform an action such as adding or deleting a row, changing the sorting, filtering or paging characteristics of the table you'll want DataTables to update the display to reflect these changes. This function is provided for that purpose.
A draw is not performed automatically by most DataTables API actions to allow grouping of actions (for example adding multiple rows is more efficient if you group them). Keep in mind that due to the chaining nature of the DataTables API, calling the `dt-api draw()` method is just a case of adding `.draw()` to your other API method calls, as shown in the examples below.
Note that calling `dt-api draw()` with any option other than the first parameter being `-string page` will result in a full re-order and re-search of the table being performed. The `-string page` option is provided when you wish the table to be updated but for these actions not to occur (for example, a page change does not require a full re-order / re-search).
</description>
<example title="Filter the table based on a custom input and redraw"><![CDATA[
var table = $('#example').DataTable();
$('#myFilter').on( 'keyup', function () {
table
.search( this.value )
.draw();
} );
]]></example>
<example title="Sort and then redraw the table maintaining current paging position"><![CDATA[
var table = $('#example').DataTable();
// Sort by column 1 and then re-draw
table
.order( [[ 1, 'asc' ]] )
.draw( false );
]]></example>
<example title="Change the table's page and then redraw (using the `-string page` option)"><![CDATA[
var table = $('#example').DataTable();
table.page( 'next' ).draw( 'page' );
]]></example>
<related type="option">drawCallback</related>
</dt-api>
|