1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
|
<?xml version="1.0" encoding="UTF-8" ?>
<dt-option group="data">
<name>data</name>
<summary>Data to use as the display data for the table.</summary>
<since>1.10</since>
<type type="array" />
<description>
DataTables can obtain the data it is to display in the table's body from a number of sources, including being passed in as an array of row data using this initialisation parameter. As with other dynamic data sources, arrays or objects can be used for the data source for each row, with `dt-init columns.data` employed to read from specific object properties.
Using this initialisation option can be useful when creating a table from a Javascript data source, or from a custom Ajax data get.
Note that if `dt-init data` is specified, the data given in the array will replace any information that was found in the table's DOM when initialised.
</description>
<example title="Using a 2D array data source"><![CDATA[
$('#example').dataTable( {
"data": [
[ "Tiger Nixon", "System Architect", "$3,120", "2011/04/25", "Edinburgh", 5421 ],
[ "Garrett Winters", "Director", "$8,422", "2011/07/25", "Edinburgh", 8422 ],
// ...
]
} );
]]></example>
<example title="Using an array of objects as a data source"><![CDATA[
$('#example').dataTable( {
"data": [
{
"name": "Tiger Nixon",
"position": "System Architect",
"salary": "$3,120",
"start_date": "2011/04/25",
"office": "Edinburgh",
"extn": 5421
},
{
"name": "Garrett Winters",
"position": "Director",
"salary": "5300",
"start_date": "2011/07/25",
"office": "Edinburgh",
"extn": "8422"
},
// ...
],
"columns": [
{ "data": "name" },
{ "data": "position" },
{ "data": "office" },
{ "data": "extn" },
{ "data": "start_date" },
{ "data": "salary" }
]
} );
]]></example>
<related type="option">ajax</related>
<related type="option">columns.data</related>
<related type="api">row.add()</related>
<related type="api">rows.add()</related>
</dt-option>
|
