1
0
mirror of https://github.com/DataTables/DataTables.git synced 2025-02-19 17:54:14 +01:00

Update - examples: Improve descriptions of examples and refer to the new extensions where appropriate

This commit is contained in:
Allan Jardine 2015-08-12 19:48:33 +01:00
parent 588e78f92b
commit 7811a69f30
86 changed files with 246 additions and 281 deletions

View File

@ -1 +1 @@
e56fa325bfc0d0d6a38dd77a0b32d56920e4ebc6
b6074edaa3dda5b9c45287a6ab8efdf065ac23cb

View File

@ -644,7 +644,7 @@ $(document).ready(function() {
<li class="active"><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -5,7 +5,7 @@
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=2.0">
<title>DataTables example - Complex headers (rowspan / colspan)</title>
<title>DataTables example - Complex headers with column visibility</title>
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
@ -35,19 +35,20 @@ $(document).ready(function() {
<body class="dt-example">
<div class="container">
<section>
<h1>DataTables example <span>Complex headers (rowspan / colspan)</span></h1>
<h1>DataTables example <span>Complex headers with column visibility</span></h1>
<div class="info">
<p>Complex headers (using colspan / rowspan) can be used to group columns of similar information in DataTables, creating a very powerful visual effect.</p>
<p>Complex headers (using <code>colspan</code> / <code>rowspan</code>) can be used to group columns of similar information in DataTables, creating a very powerful
visual effect.</p>
<p>In addition to the basic behaviour, DataTables can also take colspan and rowspans into account when working with hidden columns. The colspan and rowspan
attributes for each cell are automatically calculated and rendered on the page for you. This allows the <a href=
<p>In addition to the basic behaviour, DataTables can also take <code>colspan</code> and <code>rowspan</code>s into account when working with hidden columns. The
<code>colspan</code> and <code>rowspan</code> attributes for each cell are automatically calculated and rendered on the page for you. This allows the <a href=
"//datatables.net/reference/option/columns.visible"><code class="option" title="DataTables initialisation option">columns.visible</code></a> option and <a href=
"//datatables.net/reference/api/column().visible()"><code class="api" title="DataTables API method">column().visible()</code></a> method to take into account
rowspan / colspan cells, drawing the header correctly.</p>
<code>rowspan</code> / <code>colspan</code> cells, drawing the header correctly.</p>
<p>Note that each column must have at least one unique cell (i.e. a cell without colspan) so DataTables can use that cell to detect the column and use it to apply
ordering.</p>
<p>Note that each column must have at least one unique cell (i.e. a cell without <code>colspan</code>) so DataTables can use that cell to detect the column and use
it to apply ordering.</p>
<p>The example below shows a header spanning multiple cells over the contact information, with one of the columns that the span covers being hidden.</p>
</div>
@ -636,7 +637,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li class="active"><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li class="active"><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -19,7 +19,7 @@
<script type="text/javascript" language="javascript" class="init">
$.extend( $.fn.dataTable.defaults, {
$.extend( true, $.fn.dataTable.defaults, {
"searching": false,
"ordering": false
} );
@ -540,7 +540,7 @@ $(document).ready(function() {
<div class="tabs">
<div class="js">
<p>The Javascript shown below is used to initialise the table shown in this example:</p><code class="multiline language-js">$.extend( $.fn.dataTable.defaults, {
<p>The Javascript shown below is used to initialise the table shown in this example:</p><code class="multiline language-js">$.extend( true, $.fn.dataTable.defaults, {
&quot;searching&quot;: false,
&quot;ordering&quot;: false
} );
@ -628,7 +628,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -44,10 +44,12 @@ $(document).ready(function() {
<div class="info">
<p>As is described by the basic DOM positioning example you can use the <a href="//datatables.net/reference/option/dom"><code class="option" title=
"DataTables initialisation option">dom</code></a> initialisation parameter to move DataTables features around the table to where you want them. In addition to
this, you can also use <a href="//datatables.net/reference/option/dom"><code class="option" title="DataTables initialisation option">dom</code></a> to create
multiple instances of these table controls. Simply include the feature's identification letter where you want it to appear, as many times as you wish, and the
controls will all sync up (note that obviously the table ('t') should be included only once).</p>
"DataTables initialisation option">dom</code></a> initialisation parameter to move DataTables features around the table to where you want them.</p>
<p>In addition to this, you can also use <a href="//datatables.net/reference/option/dom"><code class="option" title=
"DataTables initialisation option">dom</code></a> to create multiple instances of these table controls. Simply include the feature's identification letter where
you want it to appear, as many times as you wish, and the controls will all sync up (note that obviously the table (<code class="string" title="String">t</code>)
should be included only once).</p>
<p>This is shown in the demo below where for four key build-in features are duplicated above and below the table.</p>
</div>
@ -635,7 +637,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li class="active"><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -638,7 +638,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -643,7 +643,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -20,11 +20,11 @@
$(document).ready(function() {
$('#example').DataTable();
var table = $('#example').DataTable();
$('#example tbody').on('click', 'tr', function () {
var name = $('td', this).eq(0).text();
alert( 'You clicked on '+name+'\'s row' );
var data = table.row( this ).data();
alert( 'You clicked on '+data[0]+'\'s row' );
} );
} );
@ -42,7 +42,9 @@ $(document).ready(function() {
as they are needed (i.e. when paging only the visible elements are actually available in the DOM). As such, this can lead to the odd hiccup when working with
events.</p>
<p>One of the best ways of dealing with this is through the use of delegated events with jQuery's <code>on</code> method, as shown in this example.</p>
<p>One of the best ways of dealing with this is through the use of delegated events with jQuery's <code>on</code> method, as shown in this example. This example
also uses the DataTables <a href="//datatables.net/reference/api/row().data()"><code class="api" title="DataTables API method">row().data()</code></a> method to
retrieve information about the selected row - the row's data so we can show it in the <code>alert</code> message in this case.</p>
</div>
<table id="example" class="display" cellspacing="0" width="100%">
@ -539,11 +541,11 @@ $(document).ready(function() {
<div class="tabs">
<div class="js">
<p>The Javascript shown below is used to initialise the table shown in this example:</p><code class="multiline language-js">$(document).ready(function() {
$('#example').DataTable();
var table = $('#example').DataTable();
$('#example tbody').on('click', 'tr', function () {
var name = $('td', this).eq(0).text();
alert( 'You clicked on '+name+'\'s row' );
var data = table.row( this ).data();
alert( 'You clicked on '+data[0]+'\'s row' );
} );
} );</code>
@ -625,7 +627,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -625,7 +625,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -48,9 +48,8 @@ $(document).ready(function() {
</ul>
<p>This example shows the use of <code>data-sort</code> and <code>data-filter</code> attributes. In this case the first column has been formatted so the first name
has abbreviated, but the full name is still searchable (search for "Bruno" for example). Additionally, although the last column contains non-numeric data in it
(<code>/y</code>) the column will correctly order numerically as the <code>data-sort</code> / <code>data-order</code> attribute is set on the column with plain
numeric data.</p>
has abbreviated, but the full name is still searchable (search for "Bruno" for example). Additionally, although the last column contains non-numeric data in it,
the column will correctly order numerically as the <code>data-sort</code> / <code>data-order</code> attribute is set on the column with plain numeric data.</p>
</div>
<table id="example" class="display" cellspacing="0" width="100%">
@ -628,7 +627,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li class="active"><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -626,7 +626,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li class="active"><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -43,7 +43,7 @@
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -624,7 +624,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -626,7 +626,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li class="active"><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -56,12 +56,12 @@ $(document).ready(function() {
<p>In the example shown here, the data read from each row in the table is read into a Javascript object with the structure:</p>
<pre>
<code class="multiline language-js">{
"name": "...",
"position": "...",
"office": "...",
"age": "...",
"name": "...",
"position": "...",
"office": "...",
"age": "...",
"start_date": "...",
"salary": "..."
"salary": "..."
}
</code>
</pre>
@ -653,7 +653,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li class="active"><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -637,7 +637,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -689,7 +689,7 @@ tr.group:hover {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -646,7 +646,7 @@ $(document).ready(function() {
<li><a href="./column_render.html">Column rendering</a></li>
<li><a href="./length_menu.html">Page length options</a></li>
<li><a href="./dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -192,7 +192,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -53,6 +53,8 @@ $(document).ready(function() {
<p>The example below shows <a href="//datatables.net/reference/option/ajax.dataSrc"><code class="option" title=
"DataTables initialisation option">ajax.dataSrc</code></a> being used as a string to get the data from a different source property, in this case <code class=
"string" title="String">demo</code> but it could be any value, included a nested property by using standard dotted Javascript object notation.</p>
<p>For more details on loading a DataTable with Ajax data, please refer to the <a href="https://datatables.net/manual/ajax">Ajax section of the manual</a>.</p>
</div>
<table id="example" class="display" cellspacing="0" width="100%">
@ -176,7 +178,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -197,7 +197,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -166,7 +166,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -191,7 +191,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -62,6 +62,8 @@ $(document).ready(function() {
}
</code>
</pre>
<p>For more details on loading a DataTable with Ajax data, please refer to the <a href="https://datatables.net/manual/ajax">Ajax section of the manual</a>.</p>
</div>
<table id="example" class="display" cellspacing="0" width="100%">
@ -190,7 +192,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -206,7 +206,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -199,7 +199,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -58,6 +58,8 @@ $(document).ready(function() {
]
</code>
</pre>
<p>For more details on loading a DataTable with Ajax data, please refer to the <a href="https://datatables.net/manual/ajax">Ajax section of the manual</a>.</p>
</div>
<table id="example" class="display" cellspacing="0" width="100%">
@ -178,7 +180,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -52,12 +52,17 @@ $(document).ready(function() {
<p>New rows can be added to a DataTable very easily using the <a href="//datatables.net/reference/api/row.add()"><code class="api" title=
"DataTables API method">row.add()</code></a> API method. Simply call the API function with the data that is to be used for the new row (be it an array or object).
Multiple rows can be added using the <a href="//datatables.net/reference/api/rows.add()"><code class="api" title="DataTables API method">rows.add()</code></a>
method (note the plural).</p>
method (note the plural). Data can be likewise be updated with the <a href="//datatables.net/reference/api/row().data()"><code class="api" title=
"DataTables API method">row().data()</code></a> and <a href="//datatables.net/reference/api/row().remove()"><code class="api" title=
"DataTables API method">row().remove()</code></a> methods.</p>
<p>Note that in order to see the new row in the table you must call the <a href="//datatables.net/reference/api/draw()"><code class="api" title=
"DataTables API method">draw()</code></a> method, which is easily done through the chaining that the DataTables API makes use of.</p>
<p>This example shows a single row being added each time the button below is clicked upon.</p>
<p>The <a href="https://editor.datatables.net/">Editor extension</a> adds full table editing controls, including creating, editing and deleting rows, to a
DataTable.</p>
</div><button id="addRow">Add new row</button>
<table id="example" class="display" cellspacing="0" width="100%">
@ -190,7 +195,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -637,7 +637,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -646,7 +646,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -1660,7 +1660,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -654,7 +654,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -670,7 +670,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -675,7 +675,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -727,7 +727,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -274,7 +274,7 @@ tr.shown td.details-control {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -46,8 +46,8 @@ $(document).ready(function() {
"DataTables API method">rows().data()</code></a> method can then be used to get the data for the selected rows. In this case it is simply counting the number of
selected rows, but much more complex interactions can easily be developed.</p>
<p>If you are looking for a more complete row selection option <a href="http://datatables.net/extras/tabletools">TableTools for DataTables</a> provides a complete
API for selecting rows and acting upon those selected rows.</p>
<p>If you are looking for a more complete and easier to use row selection option, check out the <a href="https://datatables.net/extras/select">Select extension</a>
provides an API that is fully integrated with DataTables for selecting rows and acting upon those selected rows.</p>
</div><button id="button">Row count</button>
<table id="example" class="display" cellspacing="0" width="100%">
@ -633,7 +633,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -56,8 +56,8 @@ $(document).ready(function() {
with <code>false</code> as its first parameter. This will redraw the table keeping the current paging (without the <code>false</code> parameter the paging would be
reset to the first page).</p>
<p>If you are looking for a more complete row selection option <a href="http://datatables.net/extras/tabletools">TableTools for DataTables</a> provides a complete
API for selecting rows and acting upon those selected rows.</p>
<p>If you are looking for a more complete and easier to use row selection option, check out the <a href="https://datatables.net/extras/select">Select extension</a>
provides an API that is fully integrated with DataTables for selecting rows and acting upon those selected rows.</p>
</div><button id="button">Delete selected row</button>
<table id="example" class="display" cellspacing="0" width="100%">
@ -649,7 +649,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -54,8 +54,8 @@ $(document).ready(function() {
title="DataTables API method">columns()</code></a> method to select multiple columns and then using the <a href=
"//datatables.net/reference/api/columns().visible()"><code class="api" title="DataTables API method">columns().visible()</code></a> method to set their state.</p>
<p>If you are looking for a more complete column visibility interaction controls <a href="http://datatables.net/extras/colvis">ColVis for DataTables</a> provides a
complete interface for allowing the user to show and hide columns in the table.</p>
<p>If you are looking for a more complete column visibility interaction controls, check out the <a href="https://datatables.net/extras/buttons">Buttons extension
for DataTables</a> provides a comprehensive module for column visibility control.</p>
</div>
<div>
@ -652,7 +652,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -635,7 +635,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -633,7 +633,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -620,7 +620,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -683,7 +683,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -618,7 +618,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -37,7 +37,8 @@ $(document).ready(function() {
<div class="info">
<p>Often you may want to have your table resize dynamically with the page. Typically this is done by assigning <code>width:100%</code> in your CSS, but this
presents a problem for Javascript since it can be very hard to get that relative size rather than the absolute pixels. As such, if you apply the <code>width</code>
attribute to the HTML table tag, it will be used as the width for the table (overruling any CSS styles).</p>
attribute to the HTML table tag or inline width style (<code>style="width:100%"</code>), it will be used as the width for the table (overruling any CSS
styles).</p>
<p>This example shows a table with <code>width="100%"</code> and the container is also flexible width, so as the window is resized, the table will also resize
dynamically.</p>
@ -620,7 +621,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -44,7 +44,8 @@ $(document).ready(function() {
<div class="info">
<p>There are times when you might find it useful to display only a sub-set of the information that was available in the original table. For example you might want
to reduce the amount of data shown on screen to make it clearer for the user. This is done through the <a href=
to reduce the amount of data shown on screen to make it clearer for the user (consider also using the <a href=
"https://datatables.net/extensions/responsive">Responsive extension</a> for this). This is done through the <a href=
"//datatables.net/reference/option/columns.visible"><code class="option" title="DataTables initialisation option">columns.visible</code></a> column option.</p>
<p>The column that is hidden is still part of the table and can be made visible through the <code>api column().visible()</code> API method at a future time if you
@ -643,7 +644,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -628,7 +628,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -578,7 +578,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -337,7 +337,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -790,7 +790,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -787,7 +787,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -628,7 +628,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -628,7 +628,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -622,7 +622,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -33,9 +33,10 @@ $(document).ready(function() {
<h1>DataTables example <span>Zero configuration</span></h1>
<div class="info">
<p>DataTables has most features enabled by default, so all you need to do to use it with your own tables is to call the construction function.</p>
<p>DataTables has most features enabled by default, so all you need to do to use it with your own tables is to call the construction function:
<code>$().DataTable();</code>.</p>
<p>Searching, ordering, paging etc goodness will be immediately added to the table, as shown in this example.</p>
<p>Searching, ordering and paging goodness will be immediately added to the table, as shown in this example.</p>
</div>
<table id="example" class="display" cellspacing="0" width="100%">
@ -613,7 +614,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -165,7 +165,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -615,7 +615,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -20,78 +20,56 @@
var dataSet = [
['Trident','Internet Explorer 4.0','Win 95+','4','X'],
['Trident','Internet Explorer 5.0','Win 95+','5','C'],
['Trident','Internet Explorer 5.5','Win 95+','5.5','A'],
['Trident','Internet Explorer 6','Win 98+','6','A'],
['Trident','Internet Explorer 7','Win XP SP2+','7','A'],
['Trident','AOL browser (AOL desktop)','Win XP','6','A'],
['Gecko','Firefox 1.0','Win 98+ / OSX.2+','1.7','A'],
['Gecko','Firefox 1.5','Win 98+ / OSX.2+','1.8','A'],
['Gecko','Firefox 2.0','Win 98+ / OSX.2+','1.8','A'],
['Gecko','Firefox 3.0','Win 2k+ / OSX.3+','1.9','A'],
['Gecko','Camino 1.0','OSX.2+','1.8','A'],
['Gecko','Camino 1.5','OSX.3+','1.8','A'],
['Gecko','Netscape 7.2','Win 95+ / Mac OS 8.6-9.2','1.7','A'],
['Gecko','Netscape Browser 8','Win 98SE+','1.7','A'],
['Gecko','Netscape Navigator 9','Win 98+ / OSX.2+','1.8','A'],
['Gecko','Mozilla 1.0','Win 95+ / OSX.1+',1,'A'],
['Gecko','Mozilla 1.1','Win 95+ / OSX.1+',1.1,'A'],
['Gecko','Mozilla 1.2','Win 95+ / OSX.1+',1.2,'A'],
['Gecko','Mozilla 1.3','Win 95+ / OSX.1+',1.3,'A'],
['Gecko','Mozilla 1.4','Win 95+ / OSX.1+',1.4,'A'],
['Gecko','Mozilla 1.5','Win 95+ / OSX.1+',1.5,'A'],
['Gecko','Mozilla 1.6','Win 95+ / OSX.1+',1.6,'A'],
['Gecko','Mozilla 1.7','Win 98+ / OSX.1+',1.7,'A'],
['Gecko','Mozilla 1.8','Win 98+ / OSX.1+',1.8,'A'],
['Gecko','Seamonkey 1.1','Win 98+ / OSX.2+','1.8','A'],
['Gecko','Epiphany 2.20','Gnome','1.8','A'],
['Webkit','Safari 1.2','OSX.3','125.5','A'],
['Webkit','Safari 1.3','OSX.3','312.8','A'],
['Webkit','Safari 2.0','OSX.4+','419.3','A'],
['Webkit','Safari 3.0','OSX.4+','522.1','A'],
['Webkit','OmniWeb 5.5','OSX.4+','420','A'],
['Webkit','iPod Touch / iPhone','iPod','420.1','A'],
['Webkit','S60','S60','413','A'],
['Presto','Opera 7.0','Win 95+ / OSX.1+','-','A'],
['Presto','Opera 7.5','Win 95+ / OSX.2+','-','A'],
['Presto','Opera 8.0','Win 95+ / OSX.2+','-','A'],
['Presto','Opera 8.5','Win 95+ / OSX.2+','-','A'],
['Presto','Opera 9.0','Win 95+ / OSX.3+','-','A'],
['Presto','Opera 9.2','Win 88+ / OSX.3+','-','A'],
['Presto','Opera 9.5','Win 88+ / OSX.3+','-','A'],
['Presto','Opera for Wii','Wii','-','A'],
['Presto','Nokia N800','N800','-','A'],
['Presto','Nintendo DS browser','Nintendo DS','8.5','C/A<sup>1</sup>'],
['KHTML','Konqureror 3.1','KDE 3.1','3.1','C'],
['KHTML','Konqureror 3.3','KDE 3.3','3.3','A'],
['KHTML','Konqureror 3.5','KDE 3.5','3.5','A'],
['Tasman','Internet Explorer 4.5','Mac OS 8-9','-','X'],
['Tasman','Internet Explorer 5.1','Mac OS 7.6-9','1','C'],
['Tasman','Internet Explorer 5.2','Mac OS 8-X','1','C'],
['Misc','NetFront 3.1','Embedded devices','-','C'],
['Misc','NetFront 3.4','Embedded devices','-','A'],
['Misc','Dillo 0.8','Embedded devices','-','X'],
['Misc','Links','Text only','-','X'],
['Misc','Lynx','Text only','-','X'],
['Misc','IE Mobile','Windows Mobile 6','-','C'],
['Misc','PSP browser','PSP','-','C'],
['Other browsers','All others','-','-','U']
[ "Tiger Nixon", "System Architect", "Edinburgh", "5421", "2011/04/25", "$320,800" ],
[ "Garrett Winters", "Accountant", "Tokyo", "8422", "2011/07/25", "$170,750" ],
[ "Ashton Cox", "Junior Technical Author", "San Francisco", "1562", "2009/01/12", "$86,000" ],
[ "Cedric Kelly", "Senior Javascript Developer", "Edinburgh", "6224", "2012/03/29", "$433,060" ],
[ "Airi Satou", "Accountant", "Tokyo", "5407", "2008/11/28", "$162,700" ],
[ "Brielle Williamson", "Integration Specialist", "New York", "4804", "2012/12/02", "$372,000" ],
[ "Herrod Chandler", "Sales Assistant", "San Francisco", "9608", "2012/08/06", "$137,500" ],
[ "Rhona Davidson", "Integration Specialist", "Tokyo", "6200", "2010/10/14", "$327,900" ],
[ "Colleen Hurst", "Javascript Developer", "San Francisco", "2360", "2009/09/15", "$205,500" ],
[ "Sonya Frost", "Software Engineer", "Edinburgh", "1667", "2008/12/13", "$103,600" ],
[ "Jena Gaines", "Office Manager", "London", "3814", "2008/12/19", "$90,560" ],
[ "Quinn Flynn", "Support Lead", "Edinburgh", "9497", "2013/03/03", "$342,000" ],
[ "Charde Marshall", "Regional Director", "San Francisco", "6741", "2008/10/16", "$470,600" ],
[ "Haley Kennedy", "Senior Marketing Designer", "London", "3597", "2012/12/18", "$313,500" ],
[ "Tatyana Fitzpatrick", "Regional Director", "London", "1965", "2010/03/17", "$385,750" ],
[ "Michael Silva", "Marketing Designer", "London", "1581", "2012/11/27", "$198,500" ],
[ "Paul Byrd", "Chief Financial Officer (CFO)", "New York", "3059", "2010/06/09", "$725,000" ],
[ "Gloria Little", "Systems Administrator", "New York", "1721", "2009/04/10", "$237,500" ],
[ "Bradley Greer", "Software Engineer", "London", "2558", "2012/10/13", "$132,000" ],
[ "Dai Rios", "Personnel Lead", "Edinburgh", "2290", "2012/09/26", "$217,500" ],
[ "Jenette Caldwell", "Development Lead", "New York", "1937", "2011/09/03", "$345,000" ],
[ "Yuri Berry", "Chief Marketing Officer (CMO)", "New York", "6154", "2009/06/25", "$675,000" ],
[ "Caesar Vance", "Pre-Sales Support", "New York", "8330", "2011/12/12", "$106,450" ],
[ "Doris Wilder", "Sales Assistant", "Sidney", "3023", "2010/09/20", "$85,600" ],
[ "Angelica Ramos", "Chief Executive Officer (CEO)", "London", "5797", "2009/10/09", "$1,200,000" ],
[ "Gavin Joyce", "Developer", "Edinburgh", "8822", "2010/12/22", "$92,575" ],
[ "Jennifer Chang", "Regional Director", "Singapore", "9239", "2010/11/14", "$357,650" ],
[ "Brenden Wagner", "Software Engineer", "San Francisco", "1314", "2011/06/07", "$206,850" ],
[ "Fiona Green", "Chief Operating Officer (COO)", "San Francisco", "2947", "2010/03/11", "$850,000" ],
[ "Shou Itou", "Regional Marketing", "Tokyo", "8899", "2011/08/14", "$163,000" ],
[ "Michelle House", "Integration Specialist", "Sidney", "2769", "2011/06/02", "$95,400" ],
[ "Suki Burks", "Developer", "London", "6832", "2009/10/22", "$114,500" ],
[ "Prescott Bartlett", "Technical Author", "London", "3606", "2011/05/07", "$145,000" ],
[ "Gavin Cortez", "Team Leader", "San Francisco", "2860", "2008/10/26", "$235,500" ],
[ "Martena Mccray", "Post-Sales support", "Edinburgh", "8240", "2011/03/09", "$324,050" ],
[ "Unity Butler", "Marketing Designer", "San Francisco", "5384", "2009/12/09", "$85,675" ]
];
$(document).ready(function() {
$('#demo').html( '<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table>' );
$('#example').DataTable( {
"data": dataSet,
"columns": [
{ "title": "Engine" },
{ "title": "Browser" },
{ "title": "Platform" },
{ "title": "Version", "class": "center" },
{ "title": "Grade", "class": "center" }
data: dataSet,
columns: [
{ title: "Name" },
{ title: "Position" },
{ title: "Office" },
{ title: "Extn." },
{ title: "Start date" },
{ title: "Salary" }
]
} );
} );
} );
@ -109,11 +87,13 @@ $(document).ready(function() {
initialisation object, passing in an array of data to be used (like all other DataTables handled data, this can be arrays or objects using the <a href=
"//datatables.net/reference/option/columns.data"><code class="option" title="DataTables initialisation option">columns.data</code></a> option).</p>
<p>A <code>&lt;table&gt;</code> must be available on the page for DataTables to use. This examples shows the element being added by Javascript and then
initialising the DataTable with a set of data from a Javascript array.</p>
<p>A <code class="tag" title="HTML tag">table</code> must be available on the page for DataTables to use. This examples shows an empty <code class="tag" title=
"HTML tag">table</code> element being initialising as a DataTable with a set of data from a Javascript array. The columns in the table are dynamically created
based on the <a href="//datatables.net/reference/option/columns.title"><code class="option" title="DataTables initialisation option">columns.title</code></a>
configuration option.</p>
</div>
<div id="demo"></div>
<table id="example" class="display" width="100%"></table>
<ul class="tabs">
<li class="active">Javascript</li>
@ -126,78 +106,56 @@ $(document).ready(function() {
<div class="tabs">
<div class="js">
<p>The Javascript shown below is used to initialise the table shown in this example:</p><code class="multiline language-js">var dataSet = [
['Trident','Internet Explorer 4.0','Win 95+','4','X'],
['Trident','Internet Explorer 5.0','Win 95+','5','C'],
['Trident','Internet Explorer 5.5','Win 95+','5.5','A'],
['Trident','Internet Explorer 6','Win 98+','6','A'],
['Trident','Internet Explorer 7','Win XP SP2+','7','A'],
['Trident','AOL browser (AOL desktop)','Win XP','6','A'],
['Gecko','Firefox 1.0','Win 98+ / OSX.2+','1.7','A'],
['Gecko','Firefox 1.5','Win 98+ / OSX.2+','1.8','A'],
['Gecko','Firefox 2.0','Win 98+ / OSX.2+','1.8','A'],
['Gecko','Firefox 3.0','Win 2k+ / OSX.3+','1.9','A'],
['Gecko','Camino 1.0','OSX.2+','1.8','A'],
['Gecko','Camino 1.5','OSX.3+','1.8','A'],
['Gecko','Netscape 7.2','Win 95+ / Mac OS 8.6-9.2','1.7','A'],
['Gecko','Netscape Browser 8','Win 98SE+','1.7','A'],
['Gecko','Netscape Navigator 9','Win 98+ / OSX.2+','1.8','A'],
['Gecko','Mozilla 1.0','Win 95+ / OSX.1+',1,'A'],
['Gecko','Mozilla 1.1','Win 95+ / OSX.1+',1.1,'A'],
['Gecko','Mozilla 1.2','Win 95+ / OSX.1+',1.2,'A'],
['Gecko','Mozilla 1.3','Win 95+ / OSX.1+',1.3,'A'],
['Gecko','Mozilla 1.4','Win 95+ / OSX.1+',1.4,'A'],
['Gecko','Mozilla 1.5','Win 95+ / OSX.1+',1.5,'A'],
['Gecko','Mozilla 1.6','Win 95+ / OSX.1+',1.6,'A'],
['Gecko','Mozilla 1.7','Win 98+ / OSX.1+',1.7,'A'],
['Gecko','Mozilla 1.8','Win 98+ / OSX.1+',1.8,'A'],
['Gecko','Seamonkey 1.1','Win 98+ / OSX.2+','1.8','A'],
['Gecko','Epiphany 2.20','Gnome','1.8','A'],
['Webkit','Safari 1.2','OSX.3','125.5','A'],
['Webkit','Safari 1.3','OSX.3','312.8','A'],
['Webkit','Safari 2.0','OSX.4+','419.3','A'],
['Webkit','Safari 3.0','OSX.4+','522.1','A'],
['Webkit','OmniWeb 5.5','OSX.4+','420','A'],
['Webkit','iPod Touch / iPhone','iPod','420.1','A'],
['Webkit','S60','S60','413','A'],
['Presto','Opera 7.0','Win 95+ / OSX.1+','-','A'],
['Presto','Opera 7.5','Win 95+ / OSX.2+','-','A'],
['Presto','Opera 8.0','Win 95+ / OSX.2+','-','A'],
['Presto','Opera 8.5','Win 95+ / OSX.2+','-','A'],
['Presto','Opera 9.0','Win 95+ / OSX.3+','-','A'],
['Presto','Opera 9.2','Win 88+ / OSX.3+','-','A'],
['Presto','Opera 9.5','Win 88+ / OSX.3+','-','A'],
['Presto','Opera for Wii','Wii','-','A'],
['Presto','Nokia N800','N800','-','A'],
['Presto','Nintendo DS browser','Nintendo DS','8.5','C/A&lt;sup&gt;1&lt;/sup&gt;'],
['KHTML','Konqureror 3.1','KDE 3.1','3.1','C'],
['KHTML','Konqureror 3.3','KDE 3.3','3.3','A'],
['KHTML','Konqureror 3.5','KDE 3.5','3.5','A'],
['Tasman','Internet Explorer 4.5','Mac OS 8-9','-','X'],
['Tasman','Internet Explorer 5.1','Mac OS 7.6-9','1','C'],
['Tasman','Internet Explorer 5.2','Mac OS 8-X','1','C'],
['Misc','NetFront 3.1','Embedded devices','-','C'],
['Misc','NetFront 3.4','Embedded devices','-','A'],
['Misc','Dillo 0.8','Embedded devices','-','X'],
['Misc','Links','Text only','-','X'],
['Misc','Lynx','Text only','-','X'],
['Misc','IE Mobile','Windows Mobile 6','-','C'],
['Misc','PSP browser','PSP','-','C'],
['Other browsers','All others','-','-','U']
[ &quot;Tiger Nixon&quot;, &quot;System Architect&quot;, &quot;Edinburgh&quot;, &quot;5421&quot;, &quot;2011/04/25&quot;, &quot;$320,800&quot; ],
[ &quot;Garrett Winters&quot;, &quot;Accountant&quot;, &quot;Tokyo&quot;, &quot;8422&quot;, &quot;2011/07/25&quot;, &quot;$170,750&quot; ],
[ &quot;Ashton Cox&quot;, &quot;Junior Technical Author&quot;, &quot;San Francisco&quot;, &quot;1562&quot;, &quot;2009/01/12&quot;, &quot;$86,000&quot; ],
[ &quot;Cedric Kelly&quot;, &quot;Senior Javascript Developer&quot;, &quot;Edinburgh&quot;, &quot;6224&quot;, &quot;2012/03/29&quot;, &quot;$433,060&quot; ],
[ &quot;Airi Satou&quot;, &quot;Accountant&quot;, &quot;Tokyo&quot;, &quot;5407&quot;, &quot;2008/11/28&quot;, &quot;$162,700&quot; ],
[ &quot;Brielle Williamson&quot;, &quot;Integration Specialist&quot;, &quot;New York&quot;, &quot;4804&quot;, &quot;2012/12/02&quot;, &quot;$372,000&quot; ],
[ &quot;Herrod Chandler&quot;, &quot;Sales Assistant&quot;, &quot;San Francisco&quot;, &quot;9608&quot;, &quot;2012/08/06&quot;, &quot;$137,500&quot; ],
[ &quot;Rhona Davidson&quot;, &quot;Integration Specialist&quot;, &quot;Tokyo&quot;, &quot;6200&quot;, &quot;2010/10/14&quot;, &quot;$327,900&quot; ],
[ &quot;Colleen Hurst&quot;, &quot;Javascript Developer&quot;, &quot;San Francisco&quot;, &quot;2360&quot;, &quot;2009/09/15&quot;, &quot;$205,500&quot; ],
[ &quot;Sonya Frost&quot;, &quot;Software Engineer&quot;, &quot;Edinburgh&quot;, &quot;1667&quot;, &quot;2008/12/13&quot;, &quot;$103,600&quot; ],
[ &quot;Jena Gaines&quot;, &quot;Office Manager&quot;, &quot;London&quot;, &quot;3814&quot;, &quot;2008/12/19&quot;, &quot;$90,560&quot; ],
[ &quot;Quinn Flynn&quot;, &quot;Support Lead&quot;, &quot;Edinburgh&quot;, &quot;9497&quot;, &quot;2013/03/03&quot;, &quot;$342,000&quot; ],
[ &quot;Charde Marshall&quot;, &quot;Regional Director&quot;, &quot;San Francisco&quot;, &quot;6741&quot;, &quot;2008/10/16&quot;, &quot;$470,600&quot; ],
[ &quot;Haley Kennedy&quot;, &quot;Senior Marketing Designer&quot;, &quot;London&quot;, &quot;3597&quot;, &quot;2012/12/18&quot;, &quot;$313,500&quot; ],
[ &quot;Tatyana Fitzpatrick&quot;, &quot;Regional Director&quot;, &quot;London&quot;, &quot;1965&quot;, &quot;2010/03/17&quot;, &quot;$385,750&quot; ],
[ &quot;Michael Silva&quot;, &quot;Marketing Designer&quot;, &quot;London&quot;, &quot;1581&quot;, &quot;2012/11/27&quot;, &quot;$198,500&quot; ],
[ &quot;Paul Byrd&quot;, &quot;Chief Financial Officer (CFO)&quot;, &quot;New York&quot;, &quot;3059&quot;, &quot;2010/06/09&quot;, &quot;$725,000&quot; ],
[ &quot;Gloria Little&quot;, &quot;Systems Administrator&quot;, &quot;New York&quot;, &quot;1721&quot;, &quot;2009/04/10&quot;, &quot;$237,500&quot; ],
[ &quot;Bradley Greer&quot;, &quot;Software Engineer&quot;, &quot;London&quot;, &quot;2558&quot;, &quot;2012/10/13&quot;, &quot;$132,000&quot; ],
[ &quot;Dai Rios&quot;, &quot;Personnel Lead&quot;, &quot;Edinburgh&quot;, &quot;2290&quot;, &quot;2012/09/26&quot;, &quot;$217,500&quot; ],
[ &quot;Jenette Caldwell&quot;, &quot;Development Lead&quot;, &quot;New York&quot;, &quot;1937&quot;, &quot;2011/09/03&quot;, &quot;$345,000&quot; ],
[ &quot;Yuri Berry&quot;, &quot;Chief Marketing Officer (CMO)&quot;, &quot;New York&quot;, &quot;6154&quot;, &quot;2009/06/25&quot;, &quot;$675,000&quot; ],
[ &quot;Caesar Vance&quot;, &quot;Pre-Sales Support&quot;, &quot;New York&quot;, &quot;8330&quot;, &quot;2011/12/12&quot;, &quot;$106,450&quot; ],
[ &quot;Doris Wilder&quot;, &quot;Sales Assistant&quot;, &quot;Sidney&quot;, &quot;3023&quot;, &quot;2010/09/20&quot;, &quot;$85,600&quot; ],
[ &quot;Angelica Ramos&quot;, &quot;Chief Executive Officer (CEO)&quot;, &quot;London&quot;, &quot;5797&quot;, &quot;2009/10/09&quot;, &quot;$1,200,000&quot; ],
[ &quot;Gavin Joyce&quot;, &quot;Developer&quot;, &quot;Edinburgh&quot;, &quot;8822&quot;, &quot;2010/12/22&quot;, &quot;$92,575&quot; ],
[ &quot;Jennifer Chang&quot;, &quot;Regional Director&quot;, &quot;Singapore&quot;, &quot;9239&quot;, &quot;2010/11/14&quot;, &quot;$357,650&quot; ],
[ &quot;Brenden Wagner&quot;, &quot;Software Engineer&quot;, &quot;San Francisco&quot;, &quot;1314&quot;, &quot;2011/06/07&quot;, &quot;$206,850&quot; ],
[ &quot;Fiona Green&quot;, &quot;Chief Operating Officer (COO)&quot;, &quot;San Francisco&quot;, &quot;2947&quot;, &quot;2010/03/11&quot;, &quot;$850,000&quot; ],
[ &quot;Shou Itou&quot;, &quot;Regional Marketing&quot;, &quot;Tokyo&quot;, &quot;8899&quot;, &quot;2011/08/14&quot;, &quot;$163,000&quot; ],
[ &quot;Michelle House&quot;, &quot;Integration Specialist&quot;, &quot;Sidney&quot;, &quot;2769&quot;, &quot;2011/06/02&quot;, &quot;$95,400&quot; ],
[ &quot;Suki Burks&quot;, &quot;Developer&quot;, &quot;London&quot;, &quot;6832&quot;, &quot;2009/10/22&quot;, &quot;$114,500&quot; ],
[ &quot;Prescott Bartlett&quot;, &quot;Technical Author&quot;, &quot;London&quot;, &quot;3606&quot;, &quot;2011/05/07&quot;, &quot;$145,000&quot; ],
[ &quot;Gavin Cortez&quot;, &quot;Team Leader&quot;, &quot;San Francisco&quot;, &quot;2860&quot;, &quot;2008/10/26&quot;, &quot;$235,500&quot; ],
[ &quot;Martena Mccray&quot;, &quot;Post-Sales support&quot;, &quot;Edinburgh&quot;, &quot;8240&quot;, &quot;2011/03/09&quot;, &quot;$324,050&quot; ],
[ &quot;Unity Butler&quot;, &quot;Marketing Designer&quot;, &quot;San Francisco&quot;, &quot;5384&quot;, &quot;2009/12/09&quot;, &quot;$85,675&quot; ]
];
$(document).ready(function() {
$('#demo').html( '&lt;table cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; border=&quot;0&quot; class=&quot;display&quot; id=&quot;example&quot;&gt;&lt;/table&gt;' );
$('#example').DataTable( {
&quot;data&quot;: dataSet,
&quot;columns&quot;: [
{ &quot;title&quot;: &quot;Engine&quot; },
{ &quot;title&quot;: &quot;Browser&quot; },
{ &quot;title&quot;: &quot;Platform&quot; },
{ &quot;title&quot;: &quot;Version&quot;, &quot;class&quot;: &quot;center&quot; },
{ &quot;title&quot;: &quot;Grade&quot;, &quot;class&quot;: &quot;center&quot; }
data: dataSet,
columns: [
{ title: &quot;Name&quot; },
{ title: &quot;Position&quot; },
{ title: &quot;Office&quot; },
{ title: &quot;Extn.&quot; },
{ title: &quot;Start date&quot; },
{ title: &quot;Salary&quot; }
]
} );
} );
} );</code>
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
@ -278,7 +236,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -168,7 +168,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -63,7 +63,7 @@
<li><a href="./advanced_init/column_render.html">Column rendering</a></li>
<li><a href="./advanced_init/length_menu.html">Page length options</a></li>
<li><a href="./advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="./advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="./advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="./advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="./advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="./advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -662,7 +662,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -1724,7 +1724,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -672,7 +672,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -656,7 +656,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -650,7 +650,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -183,7 +183,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -252,7 +252,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -48,16 +48,8 @@ $(document).ready(function() {
be configured using the <a href="//datatables.net/reference/option/idSrc"><code class="option" title="DataTables initialisation option">idSrc</code></a> option),
DataTables will automatically add it for you (note that this will work for Ajax and Javascript loaded data as well as for server-side processing).</p>
<p>In addition to <code>DT_RowId</code> there are other properties which perform similar actions:</p>
<ul class="markdown">
<li>{string} <code>DT_RowId</code> - Add an ID to the <code class="tag" title="HTML tag">tr</code> element</li>
<li>{string} <code>DT_RowClass</code> - Add a class name to the <code class="tag" title="HTML tag">tr</code> element</li>
<li>{object} <code>DT_RowData</code> - Add HTML5 <em>data-</em> attributes to the <code class="tag" title="HTML tag">tr</code> element. This is an object of
key / value pairs which are assigned as data attributes to the <code class="tag" title="HTML tag">tr</code> element.</li>
<li>{object} <code>DT_RowAttr</code> - Add attributes to the <code class="tag" title="HTML tag">tr</code> element. This is an object of key / value pairs which
are assigned as attributes to the <code class="tag" title="HTML tag">tr</code> element.</li>
</ul>
<p>In addition to <code>DT_RowId</code> there are other properties which perform similar actions - please refer to the <a href=
"https://datatables.net/manual/server-side">server-side processing section of the manual</a> for full details.</p>
<p>This example below shows <code>DT_RowId</code> being used to add information to the table. In addition objects are used as the data source for the rows.</p>
</div>
@ -190,7 +182,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -175,7 +175,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -180,7 +180,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -412,7 +412,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -191,7 +191,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -292,7 +292,7 @@ tr.details td.details-control {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -63,6 +63,9 @@ $(document).ready(function() {
<p>This is shown in this demo, which uses a unique ID assigned to the TR element (this is done automatically through the use of the <code>DT_RowId</code> special
property returned as part of the object given by the server for each row) to track which rows are selected and reselect them is appropriate on a draw.</p>
<p>If you are looking for a more complete and easier to use row selection option, check out the <a href="https://datatables.net/extras/select">Select extension</a>
provides an API that is fully integrated with DataTables for selecting rows and acting upon those selected rows.</p>
</div>
<table id="example" class="display" cellspacing="0" width="100%">
@ -205,7 +208,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -167,7 +167,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -620,7 +620,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -609,7 +609,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -610,7 +610,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -624,7 +624,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -21,10 +21,7 @@
<script type="text/javascript" language="javascript" class="init">
$(document).ready(function() {
$('#example').DataTable( {
scrollY: 200,
paging: false
} );
$('#example').DataTable();
} );
</script>
@ -540,10 +537,7 @@ $(document).ready(function() {
<div class="tabs">
<div class="js">
<p>The Javascript shown below is used to initialise the table shown in this example:</p><code class="multiline language-js">$(document).ready(function() {
$('#example').DataTable( {
scrollY: 200,
paging: false
} );
$('#example').DataTable();
} );</code>
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
@ -627,7 +621,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -610,7 +610,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -623,7 +623,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -609,7 +609,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -610,7 +610,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -609,7 +609,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>

View File

@ -609,7 +609,7 @@ $(document).ready(function() {
<li><a href="../advanced_init/column_render.html">Column rendering</a></li>
<li><a href="../advanced_init/length_menu.html">Page length options</a></li>
<li><a href="../advanced_init/dom_multiple_elements.html">Multiple table control elements</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers (rowspan / colspan)</a></li>
<li><a href="../advanced_init/complex_header.html">Complex headers with column visibility</a></li>
<li><a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a></li>
<li><a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a></li>
<li><a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a></li>