mirror of
https://github.com/DataTables/DataTables.git
synced 2026-01-11 15:27:57 -05:00
Compare commits
213 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
f60c412902 | ||
|
|
de73685996 | ||
|
|
17d999c184 | ||
|
|
83e59694a1 | ||
|
|
c353c308df | ||
|
|
5262818302 | ||
|
|
8059fde34c | ||
|
|
d56142f417 | ||
|
|
998efc44b1 | ||
|
|
c44e99c4eb | ||
|
|
411da6edba | ||
|
|
14b84f6dae | ||
|
|
15978fa6b5 | ||
|
|
a0aefd5ef6 | ||
|
|
12f20f0cbd | ||
|
|
a804e08b2d | ||
|
|
05414e1437 | ||
|
|
f26ec6052f | ||
|
|
0e6d8ca196 | ||
|
|
f7065b99ee | ||
|
|
358627ae0f | ||
|
|
b2ca1a9d3f | ||
|
|
0c9a4ce933 | ||
|
|
eaf4c89ee1 | ||
|
|
79c4414d97 | ||
|
|
cedb9e2ada | ||
|
|
560dde4217 | ||
|
|
05acb1ba4f | ||
|
|
49c2ccf8c7 | ||
|
|
c0071db866 | ||
|
|
99a20e7e01 | ||
|
|
c1e67aec89 | ||
|
|
adef96b700 | ||
|
|
68798c37ac | ||
|
|
5e5295febd | ||
|
|
f3f0a291cd | ||
|
|
7779ad6488 | ||
|
|
6e51a62684 | ||
|
|
9f1d1a7f49 | ||
|
|
f9d22a76da | ||
|
|
90a43ab2ff | ||
|
|
99773f6d23 | ||
|
|
37099cbf55 | ||
|
|
e42575bd39 | ||
|
|
0f2fc016e2 | ||
|
|
1ef5d10c0c | ||
|
|
6ff3e3704f | ||
|
|
ecd2c966b9 | ||
|
|
bbbb276569 | ||
|
|
277feb0075 | ||
|
|
ad7711746b | ||
|
|
83657a29e3 | ||
|
|
03d850c226 | ||
|
|
07a6d7f097 | ||
|
|
6ec6d155f1 | ||
|
|
b42f10ce98 | ||
|
|
94d67b5ebc | ||
|
|
a3965b5994 | ||
|
|
dbdeb68022 | ||
|
|
2d7be46f41 | ||
|
|
c5a908dbd2 | ||
|
|
56af3a08b2 | ||
|
|
c077e590d3 | ||
|
|
2f73d16738 | ||
|
|
c9e595ab62 | ||
|
|
b0ed3e262c | ||
|
|
b8c80378c6 | ||
|
|
68e41c4a6c | ||
|
|
1ea1821bf8 | ||
|
|
351714225c | ||
|
|
d5a2cce299 | ||
|
|
94b2b2823b | ||
|
|
b1c03b8eae | ||
|
|
2d6d87b222 | ||
|
|
cddf43257d | ||
|
|
6839b75665 | ||
|
|
cafe73625c | ||
|
|
d3d68f7e85 | ||
|
|
45a6b4e04f | ||
|
|
8e6d438bf0 | ||
|
|
ab60d5949c | ||
|
|
9de4f80772 | ||
|
|
86227bc2a1 | ||
|
|
f94a9ba56d | ||
|
|
2cd1df3996 | ||
|
|
bda9b88ada | ||
|
|
8200205ddb | ||
|
|
958ecc4dea | ||
|
|
457244d749 | ||
|
|
30e20ddc5b | ||
|
|
464f4847b3 | ||
|
|
9f591da9e2 | ||
|
|
5e6ca62d1d | ||
|
|
bc6e9e2516 | ||
|
|
5d2f6fcf7d | ||
|
|
620e9ca8be | ||
|
|
bff78f4e65 | ||
|
|
04fea4e9fa | ||
|
|
156faa8338 | ||
|
|
d975139b62 | ||
|
|
452ff3d118 | ||
|
|
cf2715ec1d | ||
|
|
3f193cee3e | ||
|
|
40a953edfb | ||
|
|
09e03fcc54 | ||
|
|
f0c2b1f51d | ||
|
|
ed848d4e9d | ||
|
|
2c0af470c5 | ||
|
|
01b7a7e952 | ||
|
|
f663114dc4 | ||
|
|
6cd1fc1876 | ||
|
|
99bb425eb5 | ||
|
|
387ee39f94 | ||
|
|
d9514170ef | ||
|
|
73fd4997dd | ||
|
|
a4b056b004 | ||
|
|
ce66166758 | ||
|
|
1efb34501e | ||
|
|
f0f1068070 | ||
|
|
145d0d6535 | ||
|
|
9a65e5272e | ||
|
|
321a0bb118 | ||
|
|
1689b5c41e | ||
|
|
2c1763253e | ||
|
|
37c33150cf | ||
|
|
66ea7ec52d | ||
|
|
45bef584b5 | ||
|
|
68f0124875 | ||
|
|
ad31f99f07 | ||
|
|
ced6c2f058 | ||
|
|
c9759a828a | ||
|
|
35d84a8785 | ||
|
|
ed07c7f945 | ||
|
|
f9b0b86357 | ||
|
|
eed346db11 | ||
|
|
0bc4349da6 | ||
|
|
2b644e3c67 | ||
|
|
04b4e4a221 | ||
|
|
3d983d3e00 | ||
|
|
2dcfd038e6 | ||
|
|
c5f9168fb3 | ||
|
|
83199449f4 | ||
|
|
d73571017a | ||
|
|
5f5525b10d | ||
|
|
5cc3676e27 | ||
|
|
db1f2383ff | ||
|
|
05dcf4d988 | ||
|
|
387e55a469 | ||
|
|
ec585db978 | ||
|
|
c1ae2747f2 | ||
|
|
64661b706c | ||
|
|
ce5e859cbd | ||
|
|
c64a7a03cb | ||
|
|
02cb21017b | ||
|
|
9f5a1fc2c3 | ||
|
|
4c558e0a13 | ||
|
|
dbcc844022 | ||
|
|
14436e1696 | ||
|
|
2b781ff0bd | ||
|
|
df4c3d25f8 | ||
|
|
4d1db22140 | ||
|
|
aee9a09035 | ||
|
|
9b95edf189 | ||
|
|
5bf38afa28 | ||
|
|
c4dd1136fb | ||
|
|
66c6139c71 | ||
|
|
f5283f648c | ||
|
|
2024dc274b | ||
|
|
cdc3f4137a | ||
|
|
4aa55efc91 | ||
|
|
5e74941660 | ||
|
|
74e37c13fe | ||
|
|
fb59f8f903 | ||
|
|
612c508f1f | ||
|
|
99a313b529 | ||
|
|
97e465613b | ||
|
|
4eec66f677 | ||
|
|
aa69bda137 | ||
|
|
3f7da1674f | ||
|
|
d7ac068183 | ||
|
|
609f3173f8 | ||
|
|
81218f4fa3 | ||
|
|
713b7498df | ||
|
|
6733264f11 | ||
|
|
72145aba3e | ||
|
|
75a665f64f | ||
|
|
421a5e17ac | ||
|
|
ae945eae3d | ||
|
|
8e0224cf11 | ||
|
|
cbec002afc | ||
|
|
2f2629433d | ||
|
|
d894dc7fbc | ||
|
|
576b38ef96 | ||
|
|
344bae3966 | ||
|
|
2000e66401 | ||
|
|
1900c20e5f | ||
|
|
57fd628cb7 | ||
|
|
8cdb720a42 | ||
|
|
b90cfd5a2f | ||
|
|
d788695396 | ||
|
|
069d24e060 | ||
|
|
114b913ad1 | ||
|
|
df9fdc0d4a | ||
|
|
98fe28aeb2 | ||
|
|
c00abc7cad | ||
|
|
1a3db258d4 | ||
|
|
df61c273c4 | ||
|
|
0aaba67759 | ||
|
|
e203d67cd8 | ||
|
|
e869cc0910 | ||
|
|
1d10612859 | ||
|
|
9f70ba35aa | ||
|
|
31db8f9f8d |
@@ -1 +1 @@
|
||||
b7352d7c29727ea5041130bc20de709e332d4e72
|
||||
561f618389f1dc30eef9c4622a5d32a1c6f73d31
|
||||
|
||||
10
Readme.md
10
Readme.md
@@ -1,3 +1,11 @@
|
||||
# Legacy repository
|
||||
|
||||
Please note that this is a **legacy repo** for DataTables. The main source repo [is DataTables/DataTablesSrc](https://github.com/DataTables/DataTablesSrc).
|
||||
|
||||
Our distribution repos (for NPM, Nuget, etc packages) are the `DataTables/Dist-*` repos - e.g. [DataTables/Dist-DataTables](https://github.com/DataTables/Dist-DataTables). Each distribution repo has a core Javascript file or styling for DataTables or an extension. Please use our [download builder](https://datatables.net/download) to obtain the files you need, including for NPM, Nuget, CDN and download.
|
||||
|
||||
|
||||
|
||||
# DataTables plug-in for jQuery
|
||||
|
||||
DataTables is a table enhancing plug-in for the [jQuery](//jquery.com) Javascript library, adding sorting, paging and filtering abilities to plain HTML tables with minimal effort. The stated goal of DataTables is:
|
||||
@@ -56,4 +64,4 @@ Support for DataTables is available through the [DataTables forums](//datatables
|
||||
|
||||
## License
|
||||
|
||||
DataTables is release under the [MIT license](//datatables.net/license). You are free to use, modify and distribute this software, as long as the copyright header is left intact (specifically the comment block which starts with `/*!`.
|
||||
DataTables is release under the [MIT license](//datatables.net/license). You are free to use, modify and distribute this software, as long as the copyright header is left intact (specifically the comment block which starts with `/*!`).
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "datatables/datatables",
|
||||
"version": "1.10.15",
|
||||
"version": "1.10.21",
|
||||
"description": "DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, based upon the foundations of progressive enhancement, which will add advanced interaction controls to any HTML table.",
|
||||
"homepage": "http://www.datatables.net/",
|
||||
"author": "SpryMedia",
|
||||
@@ -12,4 +12,4 @@
|
||||
"forum": "https://datatables.net/forums",
|
||||
"source": "https://github.com/DataTables/DataTablesSrc/"
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "DataTables",
|
||||
"version": "1.10.15",
|
||||
"version": "1.10.21",
|
||||
"description": "DataTables enhances HTML tables with the ability to sort, filter and page the data in the table very easily. It provides a comprehensive API and set of configuration options, allowing you to consume data from virtually any data source.",
|
||||
"homepage": "http://datatables.net/",
|
||||
"docs": "http://datatables.net/",
|
||||
@@ -29,4 +29,4 @@
|
||||
"page",
|
||||
"internationalisable"
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Column rendering</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -56,7 +52,7 @@ $(document).ready(function() {
|
||||
assigning colours based on content rules and any other form of text manipulation you require.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -67,16 +63,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -265,7 +251,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -321,7 +307,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -535,6 +521,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -564,7 +560,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -637,6 +633,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -685,10 +684,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -743,6 +742,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -752,14 +754,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -916,7 +915,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<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">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -41,7 +37,7 @@ $(document).ready(function() {
|
||||
<div class="info">
|
||||
<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 <code>colspan</code> and <code>rowspan</code>s into account when working with hidden columns. The
|
||||
<p>In addition to the basic behaviour, DataTables can also take <code>colspan</code> and <code>rowspan</code> 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
|
||||
@@ -51,7 +47,7 @@ $(document).ready(function() {
|
||||
<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>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th rowspan="2">Name</th>
|
||||
@@ -66,16 +62,6 @@ $(document).ready(function() {
|
||||
<th>E-mail</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Salary</th>
|
||||
<th>Office</th>
|
||||
<th>Extn.</th>
|
||||
<th>E-mail</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -265,7 +251,7 @@ $(document).ready(function() {
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>$85,600</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>3023</td>
|
||||
<td>d.wilder@datatables.net</td>
|
||||
</tr>
|
||||
@@ -321,7 +307,7 @@ $(document).ready(function() {
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>$95,400</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>2769</td>
|
||||
<td>m.house@datatables.net</td>
|
||||
</tr>
|
||||
@@ -534,6 +520,16 @@ $(document).ready(function() {
|
||||
<td>d.snider@datatables.net</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Salary</th>
|
||||
<th>Office</th>
|
||||
<th>Extn.</th>
|
||||
<th>E-mail</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -555,7 +551,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -628,6 +624,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -676,10 +675,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -734,6 +733,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -743,14 +745,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -907,7 +906,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Setting defaults</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -47,7 +43,7 @@ $(document).ready(function() {
|
||||
<p>This example shows the searching and ordering features of DataTables being disabled by default, which is reflected in the table when it is initialised.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -58,16 +54,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -256,7 +242,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -312,7 +298,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -526,6 +512,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -548,7 +544,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -621,6 +617,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -669,10 +668,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -727,6 +726,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -736,14 +738,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -900,7 +899,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Multiple table control elements</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -19,14 +19,10 @@
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -50,10 +46,10 @@ $(document).ready(function() {
|
||||
"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>
|
||||
<p>This is shown in the demo below where the four key built-in features are duplicated above and below the table.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -64,16 +60,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -262,7 +248,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -318,7 +304,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -532,6 +518,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -550,7 +546,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -629,6 +625,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -677,10 +676,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -735,6 +734,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -744,14 +746,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -908,7 +907,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Custom toolbar elements</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -17,14 +17,10 @@
|
||||
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -57,7 +53,7 @@ $(document).ready(function() {
|
||||
Excel / PDF, and more).</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -68,16 +64,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -266,7 +252,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -322,7 +308,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -536,6 +522,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -556,7 +552,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -631,6 +627,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -679,10 +678,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -737,6 +736,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -746,14 +748,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -910,7 +909,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - DataTables events</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -57,7 +53,7 @@ $(document).ready(function() {
|
||||
<div class="demo-html">
|
||||
<div id="demo_info" class="box"></div>
|
||||
</div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -68,16 +64,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -266,7 +252,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -322,7 +308,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -536,6 +522,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -562,7 +558,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -635,6 +631,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -683,10 +682,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -741,6 +740,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -750,14 +752,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -914,7 +913,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - DOM / jQuery events</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -47,7 +43,7 @@ $(document).ready(function() {
|
||||
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>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -58,16 +54,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -256,7 +242,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -312,7 +298,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -526,6 +512,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -547,7 +543,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -620,6 +616,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -668,10 +667,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -726,6 +725,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -735,14 +737,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -899,7 +898,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Footer callback</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -13,14 +13,10 @@
|
||||
th { white-space: nowrap; }
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -79,7 +75,7 @@ $(document).ready(function() {
|
||||
footer.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -89,12 +85,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th colspan="4" style="text-align:right">Total:</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger</td>
|
||||
@@ -261,7 +251,7 @@ $(document).ready(function() {
|
||||
<td>Doris</td>
|
||||
<td>Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>$85,600</td>
|
||||
</tr>
|
||||
<tr>
|
||||
@@ -310,7 +300,7 @@ $(document).ready(function() {
|
||||
<td>Michelle</td>
|
||||
<td>House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>$95,400</td>
|
||||
</tr>
|
||||
<tr>
|
||||
@@ -496,6 +486,12 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th colspan="4" style="text-align:right">Total:</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -545,7 +541,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -618,6 +614,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -666,10 +665,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -724,6 +723,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -733,14 +735,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -897,7 +896,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - HTML5 data-* attributes - cell data</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -50,7 +46,7 @@ $(document).ready(function() {
|
||||
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>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -61,16 +57,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td data-search="Tiger Nixon">T. Nixon</td>
|
||||
@@ -259,7 +245,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td data-search="Doris Wilder">D. Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td data-order="1284940800">Mon 20th Sep 10</td>
|
||||
<td data-order="85600">$85,600/y</td>
|
||||
@@ -315,7 +301,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td data-search="Michelle House">M. House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td data-order="1306972800">Thu 2nd Jun 11</td>
|
||||
<td data-order="95400">$95,400/y</td>
|
||||
@@ -529,6 +515,16 @@ $(document).ready(function() {
|
||||
<td data-order="112000">$112,000/y</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -545,7 +541,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -618,6 +614,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -665,12 +664,12 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</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>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
</li>
|
||||
@@ -724,6 +723,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -733,14 +735,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -897,7 +896,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - HTML5 data-* attributes - table options</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -37,9 +33,9 @@ $(document).ready(function() {
|
||||
<p>As of DataTables 1.10.5 it is now possible to define <a href="//datatables.net/reference/option">initialisation options</a> using HTML5 <code>data-*</code>
|
||||
attributes. The attribute names are read by DataTables and used, potentially in combination with, the standard Javascript initialisation options (with the
|
||||
<code>data-*</code> attributes taking priority).</p>
|
||||
<p>Please note that the attribute values must contain valid JSON data or a Javascript primitive (as require by <a href=
|
||||
"http://api.jquery.com/data/#data-html5">jQuery's <code>$().data()</code> method</a> - this means that double quotes should be used inside the attribute if needed
|
||||
for a string (see the <code>data-order</code> example below).</p>
|
||||
<p>Please note that the attribute values must contain valid JSON data or a Javascript primitive, as required by <a href=
|
||||
"http://api.jquery.com/data/#data-html5">jQuery's <code>$().data()</code> method</a>. This means that double quotes should be used inside the attribute if needed
|
||||
for a string (see the <code>data-order</code> in this example).</p>
|
||||
<p>Additionally, jQuery will convert a dashed string into the camel-case notation used by DataTables for its options. For example <code>data-page-length</code> is
|
||||
used to represent <a href="//datatables.net/reference/option/pageLength"><code class="option" title="DataTables initialisation option">pageLength</code></a>.</p>
|
||||
<p>The table below shows the use of <a href="//datatables.net/reference/option/pageLength"><code class="option" title=
|
||||
@@ -544,7 +540,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -617,6 +613,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -664,12 +663,12 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li class="active">
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</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>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
</li>
|
||||
@@ -723,6 +722,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -732,14 +734,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -896,7 +895,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,15 +3,12 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<title>DataTables examples - Advanced initialisation</title>
|
||||
</head>
|
||||
<body class="dt-example">
|
||||
@@ -57,10 +54,10 @@
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -90,7 +87,7 @@
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Language file</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -45,7 +41,7 @@ $(document).ready(function() {
|
||||
<p>The following example shows DataTables reading a German language file which is hosted on the <a href="http://cdn.datatables.net">DataTables CDN</a></p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -56,16 +52,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -254,7 +240,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -310,7 +296,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -524,6 +510,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -544,7 +540,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -617,6 +613,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -665,10 +664,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li class="active">
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -723,6 +722,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -732,14 +734,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -896,7 +895,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Page length options</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -47,7 +43,7 @@ $(document).ready(function() {
|
||||
<p>The example below shows a 2D array being used to include a "Show all" records option.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -58,16 +54,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -256,7 +242,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -312,7 +298,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -526,6 +512,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -544,7 +540,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -617,6 +613,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -665,10 +664,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -723,6 +722,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -732,14 +734,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -896,7 +895,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Read HTML to data objects</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -64,7 +60,7 @@ $(document).ready(function() {
|
||||
<p>Please note that this feature requires DataTables 1.10.3 or newer.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -75,16 +71,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -273,7 +259,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -329,7 +315,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -543,6 +529,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -568,7 +564,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -641,6 +637,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -689,10 +688,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -747,6 +746,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -756,14 +758,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -920,7 +919,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Row created callback</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -16,14 +16,10 @@
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -53,7 +49,7 @@ $(document).ready(function() {
|
||||
"DataTables initialisation option">columns.createdCell</code></a> could also be used to create exactly the same effect.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -64,16 +60,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -262,7 +248,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -318,7 +304,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -532,6 +518,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -554,7 +550,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -630,6 +626,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -678,10 +677,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -736,6 +735,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -745,14 +747,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -909,7 +908,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Row grouping</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -16,30 +16,27 @@ tr.group:hover {
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
var groupColumn = 2;
|
||||
var table = $('#example').DataTable({
|
||||
"columnDefs": [
|
||||
{ "visible": false, "targets": 2 }
|
||||
{ "visible": false, "targets": groupColumn }
|
||||
],
|
||||
"order": [[ 2, 'asc' ]],
|
||||
"order": [[ groupColumn, 'asc' ]],
|
||||
"displayLength": 25,
|
||||
"drawCallback": function ( settings ) {
|
||||
var api = this.api();
|
||||
var rows = api.rows( {page:'current'} ).nodes();
|
||||
var last=null;
|
||||
|
||||
api.column(2, {page:'current'} ).data().each( function ( group, i ) {
|
||||
api.column(groupColumn, {page:'current'} ).data().each( function ( group, i ) {
|
||||
if ( last !== group ) {
|
||||
$(rows).eq( i ).before(
|
||||
'<tr class="group"><td colspan="5">'+group+'</td></tr>'
|
||||
@@ -54,11 +51,11 @@ $(document).ready(function() {
|
||||
// Order by the grouping
|
||||
$('#example tbody').on( 'click', 'tr.group', function () {
|
||||
var currentOrder = table.order()[0];
|
||||
if ( currentOrder[0] === 2 && currentOrder[1] === 'asc' ) {
|
||||
table.order( [ 2, 'desc' ] ).draw();
|
||||
if ( currentOrder[0] === groupColumn && currentOrder[1] === 'asc' ) {
|
||||
table.order( [ groupColumn, 'desc' ] ).draw();
|
||||
}
|
||||
else {
|
||||
table.order( [ 2, 'asc' ] ).draw();
|
||||
table.order( [ groupColumn, 'asc' ] ).draw();
|
||||
}
|
||||
} );
|
||||
} );
|
||||
@@ -84,7 +81,7 @@ $(document).ready(function() {
|
||||
new sites that make use of row grouping, it is suggested that you use the new RowGroup extension.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -95,16 +92,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -293,7 +280,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -349,7 +336,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -563,6 +550,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -574,18 +571,19 @@ $(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() {
|
||||
var groupColumn = 2;
|
||||
var table = $('#example').DataTable({
|
||||
"columnDefs": [
|
||||
{ "visible": false, "targets": 2 }
|
||||
{ "visible": false, "targets": groupColumn }
|
||||
],
|
||||
"order": [[ 2, 'asc' ]],
|
||||
"order": [[ groupColumn, 'asc' ]],
|
||||
"displayLength": 25,
|
||||
"drawCallback": function ( settings ) {
|
||||
var api = this.api();
|
||||
var rows = api.rows( {page:'current'} ).nodes();
|
||||
var last=null;
|
||||
|
||||
api.column(2, {page:'current'} ).data().each( function ( group, i ) {
|
||||
api.column(groupColumn, {page:'current'} ).data().each( function ( group, i ) {
|
||||
if ( last !== group ) {
|
||||
$(rows).eq( i ).before(
|
||||
'<tr class="group"><td colspan="5">'+group+'</td></tr>'
|
||||
@@ -600,18 +598,18 @@ $(document).ready(function() {
|
||||
// Order by the grouping
|
||||
$('#example tbody').on( 'click', 'tr.group', function () {
|
||||
var currentOrder = table.order()[0];
|
||||
if ( currentOrder[0] === 2 && currentOrder[1] === 'asc' ) {
|
||||
table.order( [ 2, 'desc' ] ).draw();
|
||||
if ( currentOrder[0] === groupColumn && currentOrder[1] === 'asc' ) {
|
||||
table.order( [ groupColumn, 'desc' ] ).draw();
|
||||
}
|
||||
else {
|
||||
table.order( [ 2, 'asc' ] ).draw();
|
||||
table.order( [ groupColumn, 'asc' ] ).draw();
|
||||
}
|
||||
} );
|
||||
} );</code>
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -687,6 +685,9 @@ tr.group:hover {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -735,10 +736,10 @@ tr.group:hover {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -793,6 +794,9 @@ tr.group:hover {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -802,14 +806,11 @@ tr.group:hover {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -966,7 +967,7 @@ tr.group:hover {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Order direction sequence control</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -57,10 +53,10 @@ $(document).ready(function() {
|
||||
<li>Column 6 - default ordering</li>
|
||||
</ul>
|
||||
<p>It's worth noting that I don't have a good use case for when you might what to mix such complex ordering behaviour into a single table, but the example shows
|
||||
how these options can be use and therefore applied across all columns.</p>
|
||||
how these options can be used and therefore applied across all columns.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -71,16 +67,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -269,7 +255,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -325,7 +311,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -539,6 +525,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -564,7 +560,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -637,6 +633,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -685,10 +684,10 @@ $(document).ready(function() {
|
||||
<a href="./object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language_file.html">Language file</a>
|
||||
@@ -743,6 +742,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -752,14 +754,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -916,7 +915,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Flat array data source</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -61,7 +57,7 @@ $(document).ready(function() {
|
||||
object with an array inside it as is the default.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -111,7 +107,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -184,6 +180,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -232,10 +231,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -290,6 +289,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -299,14 +301,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -463,7 +462,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Custom data source property</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -38,7 +34,7 @@ $(document).ready(function() {
|
||||
<h1>DataTables example <span>Custom data source property</span></h1>
|
||||
<div class="info">
|
||||
<p>When loading data from an Ajax source, by default, DataTables will look for the data to use in the <code>data</code> parameter of a returned object (e.g.
|
||||
<code>{ "data": [...] }</code>). This can easily be change by using the <code>dataSrc</code> option of the <a href=
|
||||
<code>{ "data": [...] }</code>). This can easily be changed by using the <code>dataSrc</code> option of the <a href=
|
||||
"//datatables.net/reference/option/ajax"><code class="option" title="DataTables initialisation option">ajax</code></a> initiation option.</p>
|
||||
<p>The <a href="//datatables.net/reference/option/ajax.dataSrc"><code class="option" title="DataTables initialisation option">ajax.dataSrc</code></a> has a number
|
||||
of ways in which it can be used:</p>
|
||||
@@ -50,11 +46,11 @@ $(document).ready(function() {
|
||||
</ul>
|
||||
<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>
|
||||
"string" title="String">demo</code>, but it could be any value, including a nested property 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>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -96,7 +92,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -169,6 +165,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -217,10 +216,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -275,6 +274,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -284,14 +286,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -448,7 +447,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -187,7 +187,7 @@
|
||||
[
|
||||
"Doris Wilder",
|
||||
"Sales Assistant",
|
||||
"Sidney",
|
||||
"Sydney",
|
||||
"3023",
|
||||
"2010\/09\/20",
|
||||
"$85,600"
|
||||
@@ -243,7 +243,7 @@
|
||||
[
|
||||
"Michelle House",
|
||||
"Integration Specialist",
|
||||
"Sidney",
|
||||
"Sydney",
|
||||
"2769",
|
||||
"2011\/06\/02",
|
||||
"$95,400"
|
||||
|
||||
@@ -187,7 +187,7 @@
|
||||
[
|
||||
"Doris Wilder",
|
||||
"Sales Assistant",
|
||||
"Sidney",
|
||||
"Sydney",
|
||||
"3023",
|
||||
"2010\/09\/20",
|
||||
"$85,600"
|
||||
@@ -243,7 +243,7 @@
|
||||
[
|
||||
"Michelle House",
|
||||
"Integration Specialist",
|
||||
"Sidney",
|
||||
"Sydney",
|
||||
"2769",
|
||||
"2011\/06\/02",
|
||||
"$95,400"
|
||||
|
||||
@@ -284,7 +284,7 @@
|
||||
"start_date": "2010\/09\/20"
|
||||
},
|
||||
"contact": {
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "3023"
|
||||
}
|
||||
},
|
||||
@@ -368,7 +368,7 @@
|
||||
"start_date": "2011\/06\/02"
|
||||
},
|
||||
"contact": {
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "2769"
|
||||
}
|
||||
},
|
||||
|
||||
90004
examples/ajax/data/data_10k.txt
Normal file
90004
examples/ajax/data/data_10k.txt
Normal file
File diff suppressed because it is too large
Load Diff
9004
examples/ajax/data/data_1k.txt
Normal file
9004
examples/ajax/data/data_1k.txt
Normal file
File diff suppressed because it is too large
Load Diff
450004
examples/ajax/data/data_50k.txt
Normal file
450004
examples/ajax/data/data_50k.txt
Normal file
File diff suppressed because it is too large
Load Diff
45004
examples/ajax/data/data_5k.txt
Normal file
45004
examples/ajax/data/data_5k.txt
Normal file
File diff suppressed because it is too large
Load Diff
@@ -1,6 +1,7 @@
|
||||
{
|
||||
"data": [
|
||||
{
|
||||
"id": "1",
|
||||
"name": "Tiger Nixon",
|
||||
"position": "System Architect",
|
||||
"salary": "$320,800",
|
||||
@@ -9,6 +10,7 @@
|
||||
"extn": "5421"
|
||||
},
|
||||
{
|
||||
"id": "2",
|
||||
"name": "Garrett Winters",
|
||||
"position": "Accountant",
|
||||
"salary": "$170,750",
|
||||
@@ -17,6 +19,7 @@
|
||||
"extn": "8422"
|
||||
},
|
||||
{
|
||||
"id": "3",
|
||||
"name": "Ashton Cox",
|
||||
"position": "Junior Technical Author",
|
||||
"salary": "$86,000",
|
||||
@@ -25,6 +28,7 @@
|
||||
"extn": "1562"
|
||||
},
|
||||
{
|
||||
"id": "4",
|
||||
"name": "Cedric Kelly",
|
||||
"position": "Senior Javascript Developer",
|
||||
"salary": "$433,060",
|
||||
@@ -33,6 +37,7 @@
|
||||
"extn": "6224"
|
||||
},
|
||||
{
|
||||
"id": "5",
|
||||
"name": "Airi Satou",
|
||||
"position": "Accountant",
|
||||
"salary": "$162,700",
|
||||
@@ -41,6 +46,7 @@
|
||||
"extn": "5407"
|
||||
},
|
||||
{
|
||||
"id": "6",
|
||||
"name": "Brielle Williamson",
|
||||
"position": "Integration Specialist",
|
||||
"salary": "$372,000",
|
||||
@@ -49,6 +55,7 @@
|
||||
"extn": "4804"
|
||||
},
|
||||
{
|
||||
"id": "7",
|
||||
"name": "Herrod Chandler",
|
||||
"position": "Sales Assistant",
|
||||
"salary": "$137,500",
|
||||
@@ -57,6 +64,7 @@
|
||||
"extn": "9608"
|
||||
},
|
||||
{
|
||||
"id": "8",
|
||||
"name": "Rhona Davidson",
|
||||
"position": "Integration Specialist",
|
||||
"salary": "$327,900",
|
||||
@@ -65,6 +73,7 @@
|
||||
"extn": "6200"
|
||||
},
|
||||
{
|
||||
"id": "9",
|
||||
"name": "Colleen Hurst",
|
||||
"position": "Javascript Developer",
|
||||
"salary": "$205,500",
|
||||
@@ -73,6 +82,7 @@
|
||||
"extn": "2360"
|
||||
},
|
||||
{
|
||||
"id": "10",
|
||||
"name": "Sonya Frost",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$103,600",
|
||||
@@ -81,6 +91,7 @@
|
||||
"extn": "1667"
|
||||
},
|
||||
{
|
||||
"id": "11",
|
||||
"name": "Jena Gaines",
|
||||
"position": "Office Manager",
|
||||
"salary": "$90,560",
|
||||
@@ -89,6 +100,7 @@
|
||||
"extn": "3814"
|
||||
},
|
||||
{
|
||||
"id": "12",
|
||||
"name": "Quinn Flynn",
|
||||
"position": "Support Lead",
|
||||
"salary": "$342,000",
|
||||
@@ -97,6 +109,7 @@
|
||||
"extn": "9497"
|
||||
},
|
||||
{
|
||||
"id": "13",
|
||||
"name": "Charde Marshall",
|
||||
"position": "Regional Director",
|
||||
"salary": "$470,600",
|
||||
@@ -105,6 +118,7 @@
|
||||
"extn": "6741"
|
||||
},
|
||||
{
|
||||
"id": "14",
|
||||
"name": "Haley Kennedy",
|
||||
"position": "Senior Marketing Designer",
|
||||
"salary": "$313,500",
|
||||
@@ -113,6 +127,7 @@
|
||||
"extn": "3597"
|
||||
},
|
||||
{
|
||||
"id": "15",
|
||||
"name": "Tatyana Fitzpatrick",
|
||||
"position": "Regional Director",
|
||||
"salary": "$385,750",
|
||||
@@ -121,6 +136,7 @@
|
||||
"extn": "1965"
|
||||
},
|
||||
{
|
||||
"id": "16",
|
||||
"name": "Michael Silva",
|
||||
"position": "Marketing Designer",
|
||||
"salary": "$198,500",
|
||||
@@ -129,6 +145,7 @@
|
||||
"extn": "1581"
|
||||
},
|
||||
{
|
||||
"id": "17",
|
||||
"name": "Paul Byrd",
|
||||
"position": "Chief Financial Officer (CFO)",
|
||||
"salary": "$725,000",
|
||||
@@ -137,6 +154,7 @@
|
||||
"extn": "3059"
|
||||
},
|
||||
{
|
||||
"id": "18",
|
||||
"name": "Gloria Little",
|
||||
"position": "Systems Administrator",
|
||||
"salary": "$237,500",
|
||||
@@ -145,6 +163,7 @@
|
||||
"extn": "1721"
|
||||
},
|
||||
{
|
||||
"id": "19",
|
||||
"name": "Bradley Greer",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$132,000",
|
||||
@@ -153,6 +172,7 @@
|
||||
"extn": "2558"
|
||||
},
|
||||
{
|
||||
"id": "20",
|
||||
"name": "Dai Rios",
|
||||
"position": "Personnel Lead",
|
||||
"salary": "$217,500",
|
||||
@@ -161,6 +181,7 @@
|
||||
"extn": "2290"
|
||||
},
|
||||
{
|
||||
"id": "21",
|
||||
"name": "Jenette Caldwell",
|
||||
"position": "Development Lead",
|
||||
"salary": "$345,000",
|
||||
@@ -169,6 +190,7 @@
|
||||
"extn": "1937"
|
||||
},
|
||||
{
|
||||
"id": "22",
|
||||
"name": "Yuri Berry",
|
||||
"position": "Chief Marketing Officer (CMO)",
|
||||
"salary": "$675,000",
|
||||
@@ -177,6 +199,7 @@
|
||||
"extn": "6154"
|
||||
},
|
||||
{
|
||||
"id": "23",
|
||||
"name": "Caesar Vance",
|
||||
"position": "Pre-Sales Support",
|
||||
"salary": "$106,450",
|
||||
@@ -185,14 +208,16 @@
|
||||
"extn": "8330"
|
||||
},
|
||||
{
|
||||
"id": "24",
|
||||
"name": "Doris Wilder",
|
||||
"position": "Sales Assistant",
|
||||
"salary": "$85,600",
|
||||
"start_date": "2010\/09\/20",
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "3023"
|
||||
},
|
||||
{
|
||||
"id": "25",
|
||||
"name": "Angelica Ramos",
|
||||
"position": "Chief Executive Officer (CEO)",
|
||||
"salary": "$1,200,000",
|
||||
@@ -201,6 +226,7 @@
|
||||
"extn": "5797"
|
||||
},
|
||||
{
|
||||
"id": "26",
|
||||
"name": "Gavin Joyce",
|
||||
"position": "Developer",
|
||||
"salary": "$92,575",
|
||||
@@ -209,6 +235,7 @@
|
||||
"extn": "8822"
|
||||
},
|
||||
{
|
||||
"id": "27",
|
||||
"name": "Jennifer Chang",
|
||||
"position": "Regional Director",
|
||||
"salary": "$357,650",
|
||||
@@ -217,6 +244,7 @@
|
||||
"extn": "9239"
|
||||
},
|
||||
{
|
||||
"id": "28",
|
||||
"name": "Brenden Wagner",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$206,850",
|
||||
@@ -225,6 +253,7 @@
|
||||
"extn": "1314"
|
||||
},
|
||||
{
|
||||
"id": "29",
|
||||
"name": "Fiona Green",
|
||||
"position": "Chief Operating Officer (COO)",
|
||||
"salary": "$850,000",
|
||||
@@ -233,6 +262,7 @@
|
||||
"extn": "2947"
|
||||
},
|
||||
{
|
||||
"id": "30",
|
||||
"name": "Shou Itou",
|
||||
"position": "Regional Marketing",
|
||||
"salary": "$163,000",
|
||||
@@ -241,14 +271,16 @@
|
||||
"extn": "8899"
|
||||
},
|
||||
{
|
||||
"id": "31",
|
||||
"name": "Michelle House",
|
||||
"position": "Integration Specialist",
|
||||
"salary": "$95,400",
|
||||
"start_date": "2011\/06\/02",
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "2769"
|
||||
},
|
||||
{
|
||||
"id": "32",
|
||||
"name": "Suki Burks",
|
||||
"position": "Developer",
|
||||
"salary": "$114,500",
|
||||
@@ -257,6 +289,7 @@
|
||||
"extn": "6832"
|
||||
},
|
||||
{
|
||||
"id": "33",
|
||||
"name": "Prescott Bartlett",
|
||||
"position": "Technical Author",
|
||||
"salary": "$145,000",
|
||||
@@ -265,6 +298,7 @@
|
||||
"extn": "3606"
|
||||
},
|
||||
{
|
||||
"id": "34",
|
||||
"name": "Gavin Cortez",
|
||||
"position": "Team Leader",
|
||||
"salary": "$235,500",
|
||||
@@ -273,6 +307,7 @@
|
||||
"extn": "2860"
|
||||
},
|
||||
{
|
||||
"id": "35",
|
||||
"name": "Martena Mccray",
|
||||
"position": "Post-Sales support",
|
||||
"salary": "$324,050",
|
||||
@@ -281,6 +316,7 @@
|
||||
"extn": "8240"
|
||||
},
|
||||
{
|
||||
"id": "36",
|
||||
"name": "Unity Butler",
|
||||
"position": "Marketing Designer",
|
||||
"salary": "$85,675",
|
||||
@@ -289,6 +325,7 @@
|
||||
"extn": "5384"
|
||||
},
|
||||
{
|
||||
"id": "37",
|
||||
"name": "Howard Hatfield",
|
||||
"position": "Office Manager",
|
||||
"salary": "$164,500",
|
||||
@@ -297,6 +334,7 @@
|
||||
"extn": "7031"
|
||||
},
|
||||
{
|
||||
"id": "38",
|
||||
"name": "Hope Fuentes",
|
||||
"position": "Secretary",
|
||||
"salary": "$109,850",
|
||||
@@ -305,6 +343,7 @@
|
||||
"extn": "6318"
|
||||
},
|
||||
{
|
||||
"id": "39",
|
||||
"name": "Vivian Harrell",
|
||||
"position": "Financial Controller",
|
||||
"salary": "$452,500",
|
||||
@@ -313,6 +352,7 @@
|
||||
"extn": "9422"
|
||||
},
|
||||
{
|
||||
"id": "40",
|
||||
"name": "Timothy Mooney",
|
||||
"position": "Office Manager",
|
||||
"salary": "$136,200",
|
||||
@@ -321,6 +361,7 @@
|
||||
"extn": "7580"
|
||||
},
|
||||
{
|
||||
"id": "41",
|
||||
"name": "Jackson Bradshaw",
|
||||
"position": "Director",
|
||||
"salary": "$645,750",
|
||||
@@ -329,6 +370,7 @@
|
||||
"extn": "1042"
|
||||
},
|
||||
{
|
||||
"id": "42",
|
||||
"name": "Olivia Liang",
|
||||
"position": "Support Engineer",
|
||||
"salary": "$234,500",
|
||||
@@ -337,6 +379,7 @@
|
||||
"extn": "2120"
|
||||
},
|
||||
{
|
||||
"id": "43",
|
||||
"name": "Bruno Nash",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$163,500",
|
||||
@@ -345,6 +388,7 @@
|
||||
"extn": "6222"
|
||||
},
|
||||
{
|
||||
"id": "44",
|
||||
"name": "Sakura Yamamoto",
|
||||
"position": "Support Engineer",
|
||||
"salary": "$139,575",
|
||||
@@ -353,6 +397,7 @@
|
||||
"extn": "9383"
|
||||
},
|
||||
{
|
||||
"id": "45",
|
||||
"name": "Thor Walton",
|
||||
"position": "Developer",
|
||||
"salary": "$98,540",
|
||||
@@ -361,6 +406,7 @@
|
||||
"extn": "8327"
|
||||
},
|
||||
{
|
||||
"id": "46",
|
||||
"name": "Finn Camacho",
|
||||
"position": "Support Engineer",
|
||||
"salary": "$87,500",
|
||||
@@ -369,6 +415,7 @@
|
||||
"extn": "2927"
|
||||
},
|
||||
{
|
||||
"id": "47",
|
||||
"name": "Serge Baldwin",
|
||||
"position": "Data Coordinator",
|
||||
"salary": "$138,575",
|
||||
@@ -377,6 +424,7 @@
|
||||
"extn": "8352"
|
||||
},
|
||||
{
|
||||
"id": "48",
|
||||
"name": "Zenaida Frank",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$125,250",
|
||||
@@ -385,6 +433,7 @@
|
||||
"extn": "7439"
|
||||
},
|
||||
{
|
||||
"id": "49",
|
||||
"name": "Zorita Serrano",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$115,000",
|
||||
@@ -393,6 +442,7 @@
|
||||
"extn": "4389"
|
||||
},
|
||||
{
|
||||
"id": "50",
|
||||
"name": "Jennifer Acosta",
|
||||
"position": "Junior Javascript Developer",
|
||||
"salary": "$75,650",
|
||||
@@ -401,6 +451,7 @@
|
||||
"extn": "3431"
|
||||
},
|
||||
{
|
||||
"id": "51",
|
||||
"name": "Cara Stevens",
|
||||
"position": "Sales Assistant",
|
||||
"salary": "$145,600",
|
||||
@@ -409,6 +460,7 @@
|
||||
"extn": "3990"
|
||||
},
|
||||
{
|
||||
"id": "52",
|
||||
"name": "Hermione Butler",
|
||||
"position": "Regional Director",
|
||||
"salary": "$356,250",
|
||||
@@ -417,6 +469,7 @@
|
||||
"extn": "1016"
|
||||
},
|
||||
{
|
||||
"id": "53",
|
||||
"name": "Lael Greer",
|
||||
"position": "Systems Administrator",
|
||||
"salary": "$103,500",
|
||||
@@ -425,6 +478,7 @@
|
||||
"extn": "6733"
|
||||
},
|
||||
{
|
||||
"id": "54",
|
||||
"name": "Jonas Alexander",
|
||||
"position": "Developer",
|
||||
"salary": "$86,500",
|
||||
@@ -433,6 +487,7 @@
|
||||
"extn": "8196"
|
||||
},
|
||||
{
|
||||
"id": "55",
|
||||
"name": "Shad Decker",
|
||||
"position": "Regional Director",
|
||||
"salary": "$183,000",
|
||||
@@ -441,6 +496,7 @@
|
||||
"extn": "6373"
|
||||
},
|
||||
{
|
||||
"id": "56",
|
||||
"name": "Michael Bruce",
|
||||
"position": "Javascript Developer",
|
||||
"salary": "$183,000",
|
||||
@@ -449,6 +505,7 @@
|
||||
"extn": "5384"
|
||||
},
|
||||
{
|
||||
"id": "57",
|
||||
"name": "Donna Snider",
|
||||
"position": "Customer Support",
|
||||
"salary": "$112,000",
|
||||
|
||||
@@ -284,7 +284,7 @@
|
||||
"start_date": "2010\/09\/20"
|
||||
},
|
||||
"contact": [
|
||||
"Sidney",
|
||||
"Sydney",
|
||||
"3023"
|
||||
]
|
||||
},
|
||||
@@ -368,7 +368,7 @@
|
||||
"start_date": "2011\/06\/02"
|
||||
},
|
||||
"contact": [
|
||||
"Sidney",
|
||||
"Sydney",
|
||||
"2769"
|
||||
]
|
||||
},
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
[
|
||||
{
|
||||
"id": "1",
|
||||
"name": "Tiger Nixon",
|
||||
"position": "System Architect",
|
||||
"salary": "$320,800",
|
||||
@@ -8,6 +9,7 @@
|
||||
"extn": "5421"
|
||||
},
|
||||
{
|
||||
"id": "2",
|
||||
"name": "Garrett Winters",
|
||||
"position": "Accountant",
|
||||
"salary": "$170,750",
|
||||
@@ -16,6 +18,7 @@
|
||||
"extn": "8422"
|
||||
},
|
||||
{
|
||||
"id": "3",
|
||||
"name": "Ashton Cox",
|
||||
"position": "Junior Technical Author",
|
||||
"salary": "$86,000",
|
||||
@@ -24,6 +27,7 @@
|
||||
"extn": "1562"
|
||||
},
|
||||
{
|
||||
"id": "4",
|
||||
"name": "Cedric Kelly",
|
||||
"position": "Senior Javascript Developer",
|
||||
"salary": "$433,060",
|
||||
@@ -32,6 +36,7 @@
|
||||
"extn": "6224"
|
||||
},
|
||||
{
|
||||
"id": "5",
|
||||
"name": "Airi Satou",
|
||||
"position": "Accountant",
|
||||
"salary": "$162,700",
|
||||
@@ -40,6 +45,7 @@
|
||||
"extn": "5407"
|
||||
},
|
||||
{
|
||||
"id": "6",
|
||||
"name": "Brielle Williamson",
|
||||
"position": "Integration Specialist",
|
||||
"salary": "$372,000",
|
||||
@@ -48,6 +54,7 @@
|
||||
"extn": "4804"
|
||||
},
|
||||
{
|
||||
"id": "7",
|
||||
"name": "Herrod Chandler",
|
||||
"position": "Sales Assistant",
|
||||
"salary": "$137,500",
|
||||
@@ -56,6 +63,7 @@
|
||||
"extn": "9608"
|
||||
},
|
||||
{
|
||||
"id": "8",
|
||||
"name": "Rhona Davidson",
|
||||
"position": "Integration Specialist",
|
||||
"salary": "$327,900",
|
||||
@@ -64,6 +72,7 @@
|
||||
"extn": "6200"
|
||||
},
|
||||
{
|
||||
"id": "9",
|
||||
"name": "Colleen Hurst",
|
||||
"position": "Javascript Developer",
|
||||
"salary": "$205,500",
|
||||
@@ -72,6 +81,7 @@
|
||||
"extn": "2360"
|
||||
},
|
||||
{
|
||||
"id": "10",
|
||||
"name": "Sonya Frost",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$103,600",
|
||||
@@ -80,6 +90,7 @@
|
||||
"extn": "1667"
|
||||
},
|
||||
{
|
||||
"id": "11",
|
||||
"name": "Jena Gaines",
|
||||
"position": "Office Manager",
|
||||
"salary": "$90,560",
|
||||
@@ -88,6 +99,7 @@
|
||||
"extn": "3814"
|
||||
},
|
||||
{
|
||||
"id": "12",
|
||||
"name": "Quinn Flynn",
|
||||
"position": "Support Lead",
|
||||
"salary": "$342,000",
|
||||
@@ -96,6 +108,7 @@
|
||||
"extn": "9497"
|
||||
},
|
||||
{
|
||||
"id": "13",
|
||||
"name": "Charde Marshall",
|
||||
"position": "Regional Director",
|
||||
"salary": "$470,600",
|
||||
@@ -104,6 +117,7 @@
|
||||
"extn": "6741"
|
||||
},
|
||||
{
|
||||
"id": "14",
|
||||
"name": "Haley Kennedy",
|
||||
"position": "Senior Marketing Designer",
|
||||
"salary": "$313,500",
|
||||
@@ -112,6 +126,7 @@
|
||||
"extn": "3597"
|
||||
},
|
||||
{
|
||||
"id": "15",
|
||||
"name": "Tatyana Fitzpatrick",
|
||||
"position": "Regional Director",
|
||||
"salary": "$385,750",
|
||||
@@ -120,6 +135,7 @@
|
||||
"extn": "1965"
|
||||
},
|
||||
{
|
||||
"id": "16",
|
||||
"name": "Michael Silva",
|
||||
"position": "Marketing Designer",
|
||||
"salary": "$198,500",
|
||||
@@ -128,6 +144,7 @@
|
||||
"extn": "1581"
|
||||
},
|
||||
{
|
||||
"id": "17",
|
||||
"name": "Paul Byrd",
|
||||
"position": "Chief Financial Officer (CFO)",
|
||||
"salary": "$725,000",
|
||||
@@ -136,6 +153,7 @@
|
||||
"extn": "3059"
|
||||
},
|
||||
{
|
||||
"id": "18",
|
||||
"name": "Gloria Little",
|
||||
"position": "Systems Administrator",
|
||||
"salary": "$237,500",
|
||||
@@ -144,6 +162,7 @@
|
||||
"extn": "1721"
|
||||
},
|
||||
{
|
||||
"id": "19",
|
||||
"name": "Bradley Greer",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$132,000",
|
||||
@@ -152,6 +171,7 @@
|
||||
"extn": "2558"
|
||||
},
|
||||
{
|
||||
"id": "20",
|
||||
"name": "Dai Rios",
|
||||
"position": "Personnel Lead",
|
||||
"salary": "$217,500",
|
||||
@@ -160,6 +180,7 @@
|
||||
"extn": "2290"
|
||||
},
|
||||
{
|
||||
"id": "21",
|
||||
"name": "Jenette Caldwell",
|
||||
"position": "Development Lead",
|
||||
"salary": "$345,000",
|
||||
@@ -168,6 +189,7 @@
|
||||
"extn": "1937"
|
||||
},
|
||||
{
|
||||
"id": "22",
|
||||
"name": "Yuri Berry",
|
||||
"position": "Chief Marketing Officer (CMO)",
|
||||
"salary": "$675,000",
|
||||
@@ -176,6 +198,7 @@
|
||||
"extn": "6154"
|
||||
},
|
||||
{
|
||||
"id": "23",
|
||||
"name": "Caesar Vance",
|
||||
"position": "Pre-Sales Support",
|
||||
"salary": "$106,450",
|
||||
@@ -184,14 +207,16 @@
|
||||
"extn": "8330"
|
||||
},
|
||||
{
|
||||
"id": "24",
|
||||
"name": "Doris Wilder",
|
||||
"position": "Sales Assistant",
|
||||
"salary": "$85,600",
|
||||
"start_date": "2010\/09\/20",
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "3023"
|
||||
},
|
||||
{
|
||||
"id": "25",
|
||||
"name": "Angelica Ramos",
|
||||
"position": "Chief Executive Officer (CEO)",
|
||||
"salary": "$1,200,000",
|
||||
@@ -200,6 +225,7 @@
|
||||
"extn": "5797"
|
||||
},
|
||||
{
|
||||
"id": "26",
|
||||
"name": "Gavin Joyce",
|
||||
"position": "Developer",
|
||||
"salary": "$92,575",
|
||||
@@ -208,6 +234,7 @@
|
||||
"extn": "8822"
|
||||
},
|
||||
{
|
||||
"id": "27",
|
||||
"name": "Jennifer Chang",
|
||||
"position": "Regional Director",
|
||||
"salary": "$357,650",
|
||||
@@ -216,6 +243,7 @@
|
||||
"extn": "9239"
|
||||
},
|
||||
{
|
||||
"id": "28",
|
||||
"name": "Brenden Wagner",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$206,850",
|
||||
@@ -224,6 +252,7 @@
|
||||
"extn": "1314"
|
||||
},
|
||||
{
|
||||
"id": "29",
|
||||
"name": "Fiona Green",
|
||||
"position": "Chief Operating Officer (COO)",
|
||||
"salary": "$850,000",
|
||||
@@ -232,6 +261,7 @@
|
||||
"extn": "2947"
|
||||
},
|
||||
{
|
||||
"id": "30",
|
||||
"name": "Shou Itou",
|
||||
"position": "Regional Marketing",
|
||||
"salary": "$163,000",
|
||||
@@ -240,14 +270,16 @@
|
||||
"extn": "8899"
|
||||
},
|
||||
{
|
||||
"id": "31",
|
||||
"name": "Michelle House",
|
||||
"position": "Integration Specialist",
|
||||
"salary": "$95,400",
|
||||
"start_date": "2011\/06\/02",
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "2769"
|
||||
},
|
||||
{
|
||||
"id": "32",
|
||||
"name": "Suki Burks",
|
||||
"position": "Developer",
|
||||
"salary": "$114,500",
|
||||
@@ -256,6 +288,7 @@
|
||||
"extn": "6832"
|
||||
},
|
||||
{
|
||||
"id": "33",
|
||||
"name": "Prescott Bartlett",
|
||||
"position": "Technical Author",
|
||||
"salary": "$145,000",
|
||||
@@ -264,6 +297,7 @@
|
||||
"extn": "3606"
|
||||
},
|
||||
{
|
||||
"id": "34",
|
||||
"name": "Gavin Cortez",
|
||||
"position": "Team Leader",
|
||||
"salary": "$235,500",
|
||||
@@ -272,6 +306,7 @@
|
||||
"extn": "2860"
|
||||
},
|
||||
{
|
||||
"id": "35",
|
||||
"name": "Martena Mccray",
|
||||
"position": "Post-Sales support",
|
||||
"salary": "$324,050",
|
||||
@@ -280,6 +315,7 @@
|
||||
"extn": "8240"
|
||||
},
|
||||
{
|
||||
"id": "36",
|
||||
"name": "Unity Butler",
|
||||
"position": "Marketing Designer",
|
||||
"salary": "$85,675",
|
||||
@@ -288,6 +324,7 @@
|
||||
"extn": "5384"
|
||||
},
|
||||
{
|
||||
"id": "37",
|
||||
"name": "Howard Hatfield",
|
||||
"position": "Office Manager",
|
||||
"salary": "$164,500",
|
||||
@@ -296,6 +333,7 @@
|
||||
"extn": "7031"
|
||||
},
|
||||
{
|
||||
"id": "38",
|
||||
"name": "Hope Fuentes",
|
||||
"position": "Secretary",
|
||||
"salary": "$109,850",
|
||||
@@ -304,6 +342,7 @@
|
||||
"extn": "6318"
|
||||
},
|
||||
{
|
||||
"id": "39",
|
||||
"name": "Vivian Harrell",
|
||||
"position": "Financial Controller",
|
||||
"salary": "$452,500",
|
||||
@@ -312,6 +351,7 @@
|
||||
"extn": "9422"
|
||||
},
|
||||
{
|
||||
"id": "40",
|
||||
"name": "Timothy Mooney",
|
||||
"position": "Office Manager",
|
||||
"salary": "$136,200",
|
||||
@@ -320,6 +360,7 @@
|
||||
"extn": "7580"
|
||||
},
|
||||
{
|
||||
"id": "41",
|
||||
"name": "Jackson Bradshaw",
|
||||
"position": "Director",
|
||||
"salary": "$645,750",
|
||||
@@ -328,6 +369,7 @@
|
||||
"extn": "1042"
|
||||
},
|
||||
{
|
||||
"id": "42",
|
||||
"name": "Olivia Liang",
|
||||
"position": "Support Engineer",
|
||||
"salary": "$234,500",
|
||||
@@ -336,6 +378,7 @@
|
||||
"extn": "2120"
|
||||
},
|
||||
{
|
||||
"id": "43",
|
||||
"name": "Bruno Nash",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$163,500",
|
||||
@@ -344,6 +387,7 @@
|
||||
"extn": "6222"
|
||||
},
|
||||
{
|
||||
"id": "44",
|
||||
"name": "Sakura Yamamoto",
|
||||
"position": "Support Engineer",
|
||||
"salary": "$139,575",
|
||||
@@ -352,6 +396,7 @@
|
||||
"extn": "9383"
|
||||
},
|
||||
{
|
||||
"id": "45",
|
||||
"name": "Thor Walton",
|
||||
"position": "Developer",
|
||||
"salary": "$98,540",
|
||||
@@ -360,6 +405,7 @@
|
||||
"extn": "8327"
|
||||
},
|
||||
{
|
||||
"id": "46",
|
||||
"name": "Finn Camacho",
|
||||
"position": "Support Engineer",
|
||||
"salary": "$87,500",
|
||||
@@ -368,6 +414,7 @@
|
||||
"extn": "2927"
|
||||
},
|
||||
{
|
||||
"id": "47",
|
||||
"name": "Serge Baldwin",
|
||||
"position": "Data Coordinator",
|
||||
"salary": "$138,575",
|
||||
@@ -376,6 +423,7 @@
|
||||
"extn": "8352"
|
||||
},
|
||||
{
|
||||
"id": "48",
|
||||
"name": "Zenaida Frank",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$125,250",
|
||||
@@ -384,6 +432,7 @@
|
||||
"extn": "7439"
|
||||
},
|
||||
{
|
||||
"id": "49",
|
||||
"name": "Zorita Serrano",
|
||||
"position": "Software Engineer",
|
||||
"salary": "$115,000",
|
||||
@@ -392,6 +441,7 @@
|
||||
"extn": "4389"
|
||||
},
|
||||
{
|
||||
"id": "50",
|
||||
"name": "Jennifer Acosta",
|
||||
"position": "Junior Javascript Developer",
|
||||
"salary": "$75,650",
|
||||
@@ -400,6 +450,7 @@
|
||||
"extn": "3431"
|
||||
},
|
||||
{
|
||||
"id": "51",
|
||||
"name": "Cara Stevens",
|
||||
"position": "Sales Assistant",
|
||||
"salary": "$145,600",
|
||||
@@ -408,6 +459,7 @@
|
||||
"extn": "3990"
|
||||
},
|
||||
{
|
||||
"id": "52",
|
||||
"name": "Hermione Butler",
|
||||
"position": "Regional Director",
|
||||
"salary": "$356,250",
|
||||
@@ -416,6 +468,7 @@
|
||||
"extn": "1016"
|
||||
},
|
||||
{
|
||||
"id": "53",
|
||||
"name": "Lael Greer",
|
||||
"position": "Systems Administrator",
|
||||
"salary": "$103,500",
|
||||
@@ -424,6 +477,7 @@
|
||||
"extn": "6733"
|
||||
},
|
||||
{
|
||||
"id": "54",
|
||||
"name": "Jonas Alexander",
|
||||
"position": "Developer",
|
||||
"salary": "$86,500",
|
||||
@@ -432,6 +486,7 @@
|
||||
"extn": "8196"
|
||||
},
|
||||
{
|
||||
"id": "55",
|
||||
"name": "Shad Decker",
|
||||
"position": "Regional Director",
|
||||
"salary": "$183,000",
|
||||
@@ -440,6 +495,7 @@
|
||||
"extn": "6373"
|
||||
},
|
||||
{
|
||||
"id": "56",
|
||||
"name": "Michael Bruce",
|
||||
"position": "Javascript Developer",
|
||||
"salary": "$183,000",
|
||||
@@ -448,6 +504,7 @@
|
||||
"extn": "5384"
|
||||
},
|
||||
{
|
||||
"id": "57",
|
||||
"name": "Donna Snider",
|
||||
"position": "Customer Support",
|
||||
"salary": "$112,000",
|
||||
|
||||
460
examples/ajax/data/objects_salary.txt
Normal file
460
examples/ajax/data/objects_salary.txt
Normal file
@@ -0,0 +1,460 @@
|
||||
{
|
||||
"data": [
|
||||
{
|
||||
"name": "Tiger Nixon",
|
||||
"position": "System Architect",
|
||||
"salary": "320800",
|
||||
"start_date": "2011\/04\/25",
|
||||
"office": "Edinburgh",
|
||||
"extn": "5421"
|
||||
},
|
||||
{
|
||||
"name": "Garrett Winters",
|
||||
"position": "Accountant",
|
||||
"salary": "170750",
|
||||
"start_date": "2011\/07\/25",
|
||||
"office": "Tokyo",
|
||||
"extn": "8422"
|
||||
},
|
||||
{
|
||||
"name": "Ashton Cox",
|
||||
"position": "Junior Technical Author",
|
||||
"salary": "86000",
|
||||
"start_date": "2009\/01\/12",
|
||||
"office": "San Francisco",
|
||||
"extn": "1562"
|
||||
},
|
||||
{
|
||||
"name": "Cedric Kelly",
|
||||
"position": "Senior Javascript Developer",
|
||||
"salary": "433060",
|
||||
"start_date": "2012\/03\/29",
|
||||
"office": "Edinburgh",
|
||||
"extn": "6224"
|
||||
},
|
||||
{
|
||||
"name": "Airi Satou",
|
||||
"position": "Accountant",
|
||||
"salary": "162700",
|
||||
"start_date": "2008\/11\/28",
|
||||
"office": "Tokyo",
|
||||
"extn": "5407"
|
||||
},
|
||||
{
|
||||
"name": "Brielle Williamson",
|
||||
"position": "Integration Specialist",
|
||||
"salary": "372000",
|
||||
"start_date": "2012\/12\/02",
|
||||
"office": "New York",
|
||||
"extn": "4804"
|
||||
},
|
||||
{
|
||||
"name": "Herrod Chandler",
|
||||
"position": "Sales Assistant",
|
||||
"salary": "137500",
|
||||
"start_date": "2012\/08\/06",
|
||||
"office": "San Francisco",
|
||||
"extn": "9608"
|
||||
},
|
||||
{
|
||||
"name": "Rhona Davidson",
|
||||
"position": "Integration Specialist",
|
||||
"salary": "327900",
|
||||
"start_date": "2010\/10\/14",
|
||||
"office": "Tokyo",
|
||||
"extn": "6200"
|
||||
},
|
||||
{
|
||||
"name": "Colleen Hurst",
|
||||
"position": "Javascript Developer",
|
||||
"salary": "205500",
|
||||
"start_date": "2009\/09\/15",
|
||||
"office": "San Francisco",
|
||||
"extn": "2360"
|
||||
},
|
||||
{
|
||||
"name": "Sonya Frost",
|
||||
"position": "Software Engineer",
|
||||
"salary": "103600",
|
||||
"start_date": "2008\/12\/13",
|
||||
"office": "Edinburgh",
|
||||
"extn": "1667"
|
||||
},
|
||||
{
|
||||
"name": "Jena Gaines",
|
||||
"position": "Office Manager",
|
||||
"salary": "90560",
|
||||
"start_date": "2008\/12\/19",
|
||||
"office": "London",
|
||||
"extn": "3814"
|
||||
},
|
||||
{
|
||||
"name": "Quinn Flynn",
|
||||
"position": "Support Lead",
|
||||
"salary": "342000",
|
||||
"start_date": "2013\/03\/03",
|
||||
"office": "Edinburgh",
|
||||
"extn": "9497"
|
||||
},
|
||||
{
|
||||
"name": "Charde Marshall",
|
||||
"position": "Regional Director",
|
||||
"salary": "470600",
|
||||
"start_date": "2008\/10\/16",
|
||||
"office": "San Francisco",
|
||||
"extn": "6741"
|
||||
},
|
||||
{
|
||||
"name": "Haley Kennedy",
|
||||
"position": "Senior Marketing Designer",
|
||||
"salary": "313500",
|
||||
"start_date": "2012\/12\/18",
|
||||
"office": "London",
|
||||
"extn": "3597"
|
||||
},
|
||||
{
|
||||
"name": "Tatyana Fitzpatrick",
|
||||
"position": "Regional Director",
|
||||
"salary": "385750",
|
||||
"start_date": "2010\/03\/17",
|
||||
"office": "London",
|
||||
"extn": "1965"
|
||||
},
|
||||
{
|
||||
"name": "Michael Silva",
|
||||
"position": "Marketing Designer",
|
||||
"salary": "198500",
|
||||
"start_date": "2012\/11\/27",
|
||||
"office": "London",
|
||||
"extn": "1581"
|
||||
},
|
||||
{
|
||||
"name": "Paul Byrd",
|
||||
"position": "Chief Financial Officer (CFO)",
|
||||
"salary": "725000",
|
||||
"start_date": "2010\/06\/09",
|
||||
"office": "New York",
|
||||
"extn": "3059"
|
||||
},
|
||||
{
|
||||
"name": "Gloria Little",
|
||||
"position": "Systems Administrator",
|
||||
"salary": "237500",
|
||||
"start_date": "2009\/04\/10",
|
||||
"office": "New York",
|
||||
"extn": "1721"
|
||||
},
|
||||
{
|
||||
"name": "Bradley Greer",
|
||||
"position": "Software Engineer",
|
||||
"salary": "132000",
|
||||
"start_date": "2012\/10\/13",
|
||||
"office": "London",
|
||||
"extn": "2558"
|
||||
},
|
||||
{
|
||||
"name": "Dai Rios",
|
||||
"position": "Personnel Lead",
|
||||
"salary": "217500",
|
||||
"start_date": "2012\/09\/26",
|
||||
"office": "Edinburgh",
|
||||
"extn": "2290"
|
||||
},
|
||||
{
|
||||
"name": "Jenette Caldwell",
|
||||
"position": "Development Lead",
|
||||
"salary": "345000",
|
||||
"start_date": "2011\/09\/03",
|
||||
"office": "New York",
|
||||
"extn": "1937"
|
||||
},
|
||||
{
|
||||
"name": "Yuri Berry",
|
||||
"position": "Chief Marketing Officer (CMO)",
|
||||
"salary": "675000",
|
||||
"start_date": "2009\/06\/25",
|
||||
"office": "New York",
|
||||
"extn": "6154"
|
||||
},
|
||||
{
|
||||
"name": "Caesar Vance",
|
||||
"position": "Pre-Sales Support",
|
||||
"salary": "106450",
|
||||
"start_date": "2011\/12\/12",
|
||||
"office": "New York",
|
||||
"extn": "8330"
|
||||
},
|
||||
{
|
||||
"name": "Doris Wilder",
|
||||
"position": "Sales Assistant",
|
||||
"salary": "85600",
|
||||
"start_date": "2010\/09\/20",
|
||||
"office": "Sydney",
|
||||
"extn": "3023"
|
||||
},
|
||||
{
|
||||
"name": "Angelica Ramos",
|
||||
"position": "Chief Executive Officer (CEO)",
|
||||
"salary": "1200000",
|
||||
"start_date": "2009\/10\/09",
|
||||
"office": "London",
|
||||
"extn": "5797"
|
||||
},
|
||||
{
|
||||
"name": "Gavin Joyce",
|
||||
"position": "Developer",
|
||||
"salary": "92575",
|
||||
"start_date": "2010\/12\/22",
|
||||
"office": "Edinburgh",
|
||||
"extn": "8822"
|
||||
},
|
||||
{
|
||||
"name": "Jennifer Chang",
|
||||
"position": "Regional Director",
|
||||
"salary": "357650",
|
||||
"start_date": "2010\/11\/14",
|
||||
"office": "Argentina",
|
||||
"extn": "9239"
|
||||
},
|
||||
{
|
||||
"name": "Brenden Wagner",
|
||||
"position": "Software Engineer",
|
||||
"salary": "206850",
|
||||
"start_date": "2011\/06\/07",
|
||||
"office": "San Francisco",
|
||||
"extn": "1314"
|
||||
},
|
||||
{
|
||||
"name": "Fiona Green",
|
||||
"position": "Chief Operating Officer (COO)",
|
||||
"salary": "850000",
|
||||
"start_date": "2010\/03\/11",
|
||||
"office": "San Francisco",
|
||||
"extn": "2947"
|
||||
},
|
||||
{
|
||||
"name": "Shou Itou",
|
||||
"position": "Regional Marketing",
|
||||
"salary": "163000",
|
||||
"start_date": "2011\/08\/14",
|
||||
"office": "Tokyo",
|
||||
"extn": "8899"
|
||||
},
|
||||
{
|
||||
"name": "Michelle House",
|
||||
"position": "Integration Specialist",
|
||||
"salary": "95400",
|
||||
"start_date": "2011\/06\/02",
|
||||
"office": "Sydney",
|
||||
"extn": "2769"
|
||||
},
|
||||
{
|
||||
"name": "Suki Burks",
|
||||
"position": "Developer",
|
||||
"salary": "114500",
|
||||
"start_date": "2009\/10\/22",
|
||||
"office": "London",
|
||||
"extn": "6832"
|
||||
},
|
||||
{
|
||||
"name": "Prescott Bartlett",
|
||||
"position": "Technical Author",
|
||||
"salary": "145000",
|
||||
"start_date": "2011\/05\/07",
|
||||
"office": "London",
|
||||
"extn": "3606"
|
||||
},
|
||||
{
|
||||
"name": "Gavin Cortez",
|
||||
"position": "Team Leader",
|
||||
"salary": "235500",
|
||||
"start_date": "2008\/10\/26",
|
||||
"office": "San Francisco",
|
||||
"extn": "2860"
|
||||
},
|
||||
{
|
||||
"name": "Martena Mccray",
|
||||
"position": "Post-Sales support",
|
||||
"salary": "324050",
|
||||
"start_date": "2011\/03\/09",
|
||||
"office": "Edinburgh",
|
||||
"extn": "8240"
|
||||
},
|
||||
{
|
||||
"name": "Unity Butler",
|
||||
"position": "Marketing Designer",
|
||||
"salary": "85675",
|
||||
"start_date": "2009\/12\/09",
|
||||
"office": "San Francisco",
|
||||
"extn": "5384"
|
||||
},
|
||||
{
|
||||
"name": "Howard Hatfield",
|
||||
"position": "Office Manager",
|
||||
"salary": "164500",
|
||||
"start_date": "2008\/12\/16",
|
||||
"office": "San Francisco",
|
||||
"extn": "7031"
|
||||
},
|
||||
{
|
||||
"name": "Hope Fuentes",
|
||||
"position": "Secretary",
|
||||
"salary": "109850",
|
||||
"start_date": "2010\/02\/12",
|
||||
"office": "San Francisco",
|
||||
"extn": "6318"
|
||||
},
|
||||
{
|
||||
"name": "Vivian Harrell",
|
||||
"position": "Financial Controller",
|
||||
"salary": "452500",
|
||||
"start_date": "2009\/02\/14",
|
||||
"office": "San Francisco",
|
||||
"extn": "9422"
|
||||
},
|
||||
{
|
||||
"name": "Timothy Mooney",
|
||||
"position": "Office Manager",
|
||||
"salary": "136200",
|
||||
"start_date": "2008\/12\/11",
|
||||
"office": "London",
|
||||
"extn": "7580"
|
||||
},
|
||||
{
|
||||
"name": "Jackson Bradshaw",
|
||||
"position": "Director",
|
||||
"salary": "645750",
|
||||
"start_date": "2008\/09\/26",
|
||||
"office": "New York",
|
||||
"extn": "1042"
|
||||
},
|
||||
{
|
||||
"name": "Olivia Liang",
|
||||
"position": "Support Engineer",
|
||||
"salary": "234500",
|
||||
"start_date": "2011\/02\/03",
|
||||
"office": "Argentina",
|
||||
"extn": "2120"
|
||||
},
|
||||
{
|
||||
"name": "Bruno Nash",
|
||||
"position": "Software Engineer",
|
||||
"salary": "163500",
|
||||
"start_date": "2011\/05\/03",
|
||||
"office": "London",
|
||||
"extn": "6222"
|
||||
},
|
||||
{
|
||||
"name": "Sakura Yamamoto",
|
||||
"position": "Support Engineer",
|
||||
"salary": "139575",
|
||||
"start_date": "2009\/08\/19",
|
||||
"office": "Tokyo",
|
||||
"extn": "9383"
|
||||
},
|
||||
{
|
||||
"name": "Thor Walton",
|
||||
"position": "Developer",
|
||||
"salary": "98540",
|
||||
"start_date": "2013\/08\/11",
|
||||
"office": "New York",
|
||||
"extn": "8327"
|
||||
},
|
||||
{
|
||||
"name": "Finn Camacho",
|
||||
"position": "Support Engineer",
|
||||
"salary": "87500",
|
||||
"start_date": "2009\/07\/07",
|
||||
"office": "San Francisco",
|
||||
"extn": "2927"
|
||||
},
|
||||
{
|
||||
"name": "Serge Baldwin",
|
||||
"position": "Data Coordinator",
|
||||
"salary": "138575",
|
||||
"start_date": "2012\/04\/09",
|
||||
"office": "Argentina",
|
||||
"extn": "8352"
|
||||
},
|
||||
{
|
||||
"name": "Zenaida Frank",
|
||||
"position": "Software Engineer",
|
||||
"salary": "125250",
|
||||
"start_date": "2010\/01\/04",
|
||||
"office": "New York",
|
||||
"extn": "7439"
|
||||
},
|
||||
{
|
||||
"name": "Zorita Serrano",
|
||||
"position": "Software Engineer",
|
||||
"salary": "115000",
|
||||
"start_date": "2012\/06\/01",
|
||||
"office": "San Francisco",
|
||||
"extn": "4389"
|
||||
},
|
||||
{
|
||||
"name": "Jennifer Acosta",
|
||||
"position": "Junior Javascript Developer",
|
||||
"salary": "75650",
|
||||
"start_date": "2013\/02\/01",
|
||||
"office": "Edinburgh",
|
||||
"extn": "3431"
|
||||
},
|
||||
{
|
||||
"name": "Cara Stevens",
|
||||
"position": "Sales Assistant",
|
||||
"salary": "145600",
|
||||
"start_date": "2011\/12\/06",
|
||||
"office": "New York",
|
||||
"extn": "3990"
|
||||
},
|
||||
{
|
||||
"name": "Hermione Butler",
|
||||
"position": "Regional Director",
|
||||
"salary": "356250",
|
||||
"start_date": "2011\/03\/21",
|
||||
"office": "London",
|
||||
"extn": "1016"
|
||||
},
|
||||
{
|
||||
"name": "Lael Greer",
|
||||
"position": "Systems Administrator",
|
||||
"salary": "103500",
|
||||
"start_date": "2009\/02\/27",
|
||||
"office": "London",
|
||||
"extn": "6733"
|
||||
},
|
||||
{
|
||||
"name": "Jonas Alexander",
|
||||
"position": "Developer",
|
||||
"salary": "86500",
|
||||
"start_date": "2010\/07\/14",
|
||||
"office": "San Francisco",
|
||||
"extn": "8196"
|
||||
},
|
||||
{
|
||||
"name": "Shad Decker",
|
||||
"position": "Regional Director",
|
||||
"salary": "183000",
|
||||
"start_date": "2008\/11\/13",
|
||||
"office": "Edinburgh",
|
||||
"extn": "6373"
|
||||
},
|
||||
{
|
||||
"name": "Michael Bruce",
|
||||
"position": "Javascript Developer",
|
||||
"salary": "183000",
|
||||
"start_date": "2011\/06\/27",
|
||||
"office": "Argentina",
|
||||
"extn": "5384"
|
||||
},
|
||||
{
|
||||
"name": "Donna Snider",
|
||||
"position": "Customer Support",
|
||||
"salary": "112000",
|
||||
"start_date": "2011\/01\/25",
|
||||
"office": "New York",
|
||||
"extn": "4226"
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -309,7 +309,7 @@
|
||||
"$85,600",
|
||||
"2010\/09\/20"
|
||||
],
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "3023"
|
||||
},
|
||||
{
|
||||
@@ -400,7 +400,7 @@
|
||||
"$95,400",
|
||||
"2011\/06\/02"
|
||||
],
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "2769"
|
||||
},
|
||||
{
|
||||
|
||||
@@ -261,7 +261,7 @@
|
||||
"display": "Mon 20th Sep 10",
|
||||
"timestamp": "1284940800"
|
||||
},
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "3023"
|
||||
},
|
||||
{
|
||||
@@ -338,7 +338,7 @@
|
||||
"display": "Thu 2nd Jun 11",
|
||||
"timestamp": "1306972800"
|
||||
},
|
||||
"office": "Sidney",
|
||||
"office": "Sydney",
|
||||
"extn": "2769"
|
||||
},
|
||||
{
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Nested object data (objects)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -67,7 +63,7 @@ $(document).ready(function() {
|
||||
</code></pre>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -115,7 +111,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -188,6 +184,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -236,10 +235,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -294,6 +293,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -303,14 +305,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -467,7 +466,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Deferred rendering for speed</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -46,7 +42,7 @@ $(document).ready(function() {
|
||||
significantly from simply enabling this parameter.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -86,7 +82,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -159,6 +155,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -207,10 +206,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -265,6 +264,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -274,14 +276,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -438,7 +437,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,15 +3,12 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<title>DataTables examples - Ajax sourced data</title>
|
||||
</head>
|
||||
<body class="dt-example">
|
||||
@@ -68,7 +65,7 @@
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Generated content for a column</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -62,10 +58,10 @@ $(document).ready(function() {
|
||||
bit of information about it in an <code>alert</code> box. This is a simple use case, but it can be built up to be arbitrarily complex.</p>
|
||||
<p>Note also that the <a href="//datatables.net/reference/option/columns.data"><code class="option" title=
|
||||
"DataTables initialisation option">columns.data</code></a> option for the column has been set to <code>null</code> to indicate that the column has no information
|
||||
that should be obtained data source object.</p>
|
||||
contained in the data source object.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -114,7 +110,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -187,6 +183,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -235,10 +234,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -293,6 +292,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -302,14 +304,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -466,7 +465,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Ajax data source (objects)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -62,7 +58,7 @@ $(document).ready(function() {
|
||||
<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>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -109,7 +105,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -182,6 +178,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -230,10 +229,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -288,6 +287,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -297,14 +299,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -461,7 +460,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Nested object data (arrays)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -76,7 +72,7 @@ $(document).ready(function() {
|
||||
</code></pre>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -123,7 +119,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -196,6 +192,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -244,10 +243,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -302,6 +301,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -311,14 +313,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -475,7 +474,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Orthogonal data</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -67,7 +63,7 @@ $(document).ready(function() {
|
||||
</code></pre>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -117,7 +113,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -190,6 +186,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -238,10 +237,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -296,6 +295,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -305,14 +307,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -469,7 +468,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Ajax data source (arrays)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -41,7 +37,7 @@ $(document).ready(function() {
|
||||
advanced configuration such as altering how the Ajax request is made. See the <a href="//datatables.net/reference/option/ajax"><code class="option" title=
|
||||
"DataTables initialisation option">ajax</code></a> documentation or the other Ajax examples for DataTables for further information.</p>
|
||||
<p>By default DataTables will assume that an array data source is to be used and will read the information to be displayed in each column from the row's array
|
||||
using the column index, making working with arrays very simple (note that this can be changed, or objects used may using the <a href=
|
||||
using the column index, making working with arrays very simple (note that this can be changed, or objects may use the <a href=
|
||||
"//datatables.net/reference/option/columns.data"><code class="option" title="DataTables initialisation option">columns.data</code></a> option, shown in other
|
||||
examples).</p>
|
||||
<p>The example below shows DataTables loading data for a table from arrays as the data source, where the structure of the row's data source in this example is:</p>
|
||||
@@ -57,7 +53,7 @@ $(document).ready(function() {
|
||||
<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>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -96,7 +92,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -169,6 +165,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -217,10 +216,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -275,6 +274,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -284,14 +286,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -448,7 +447,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Add rows</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -50,22 +46,22 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Add rows</span></h1>
|
||||
<div class="info">
|
||||
<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). Data can be likewise be updated with the <a href="//datatables.net/reference/api/row().data()"><code class="api" title=
|
||||
<p>New rows can be added to a DataTable 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 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). Data can 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>
|
||||
"DataTables API method">draw()</code></a> method, which is easily done through the chaining that the DataTables API employs.</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>
|
||||
<p>The <a href="https://editor.datatables.net/">Editor extension</a> adds full table editing controls to a DataTable, including creating, editing and deleting
|
||||
rows.</p>
|
||||
</div>
|
||||
<div class="demo-html">
|
||||
<button id="addRow">Add new row</button>
|
||||
</div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Column 1</th>
|
||||
@@ -116,7 +112,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -189,6 +185,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -237,10 +236,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -295,6 +294,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -304,14 +306,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -468,7 +467,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Using API in callbacks</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -54,7 +50,7 @@ $(document).ready(function() {
|
||||
shows the use of the API inside the callbacks!</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -65,16 +61,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -263,7 +249,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -319,7 +305,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -533,6 +519,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -556,7 +552,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -629,6 +625,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -677,10 +676,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -735,6 +734,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -744,14 +746,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -908,7 +907,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Index column</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -47,7 +43,7 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Index column</span></h1>
|
||||
<div class="info">
|
||||
<p>Highly-interactive tables often require a 'counter' column that contains the position in the table for each row. This column should not be sortable, and will
|
||||
<p>Highly-interactive tables often require a 'counter' column that contains the position for each row in the table. This column should not be sortable, and will
|
||||
change dynamically as the ordering and searching applied to the table is altered by the end user.</p>
|
||||
<p>This example shows how this can be achieved with DataTables, where the first column is the counter column, and is updated when ordering or searching occurs.
|
||||
This is done by listening for the <a href="//datatables.net/reference/event/order"><code class="event" title="DataTables event">order</code></a> and <a href=
|
||||
@@ -58,7 +54,7 @@ $(document).ready(function() {
|
||||
"DataTables API method">column()</code></a> method to get the nodes in the current order and with the currently applied filter.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
@@ -69,16 +65,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td></td>
|
||||
@@ -268,7 +254,7 @@ $(document).ready(function() {
|
||||
<td></td>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>$85,600</td>
|
||||
</tr>
|
||||
@@ -324,7 +310,7 @@ $(document).ready(function() {
|
||||
<td></td>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>$95,400</td>
|
||||
</tr>
|
||||
@@ -537,6 +523,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -566,7 +562,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -639,6 +635,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -687,10 +686,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -745,6 +744,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -754,14 +756,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -918,7 +917,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Form inputs</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,19 +11,20 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
$(document).ready(function() {
|
||||
var table = $('#example').DataTable();
|
||||
var table = $('#example').DataTable({
|
||||
columnDefs: [{
|
||||
orderable: false,
|
||||
targets: [1,2,3]
|
||||
}]
|
||||
});
|
||||
|
||||
$('button').click( function() {
|
||||
var data = table.$('input, select').serialize();
|
||||
@@ -56,7 +57,7 @@ $(document).ready(function() {
|
||||
<div class="demo-html">
|
||||
<button type="submit">Submit form</button>
|
||||
</div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -65,14 +66,6 @@ $(document).ready(function() {
|
||||
<th>Office</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Age</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -1329,6 +1322,14 @@ $(document).ready(function() {
|
||||
</select></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Age</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -1340,7 +1341,12 @@ $(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() {
|
||||
var table = $('#example').DataTable();
|
||||
var table = $('#example').DataTable({
|
||||
columnDefs: [{
|
||||
orderable: false,
|
||||
targets: [1,2,3]
|
||||
}]
|
||||
});
|
||||
|
||||
$('button').click( function() {
|
||||
var data = table.$('input, select').serialize();
|
||||
@@ -1354,7 +1360,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -1427,6 +1433,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -1475,10 +1484,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -1533,6 +1542,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -1542,14 +1554,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -1706,7 +1715,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Highlighting rows and columns</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -17,14 +17,10 @@ td.highlight {
|
||||
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -48,16 +44,16 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Highlighting rows and columns</span></h1>
|
||||
<div class="info">
|
||||
<p>Highlighting rows and columns have be quite useful for drawing attention to where the user's cursor is in a table, particularly if you have a lot of narrow
|
||||
columns. Of course the highlighting of a row is easy enough using CSS, but for column highlighting, you need to use a little bit of Javascript.</p>
|
||||
<p>This example shows that in action on DataTable by making use of the <a href="//datatables.net/reference/api/cell().index()"><code class="api" title=
|
||||
<p>Highlighting rows and columns can be useful for drawing attention to where the user's cursor is in a table, particularly if you have a lot of narrow columns.
|
||||
Highlighting a row is easy using CSS, but for column highlighting, you need to use a little bit of Javascript.</p>
|
||||
<p>This example shows DataTables making use of the <a href="//datatables.net/reference/api/cell().index()"><code class="api" title=
|
||||
"DataTables API method">cell().index()</code></a> method to get the index of the column that is to be operated on, and then the <a href=
|
||||
"//datatables.net/reference/api/cells().nodes()"><code class="api" title="DataTables API method">cells().nodes()</code></a> and <a href=
|
||||
"//datatables.net/reference/api/column().nodes()"><code class="api" title="DataTables API method">column().nodes()</code></a> methods to remove old classes and
|
||||
apply the new highlighted class, respectively.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="row-border hover order-column" cellspacing="0" width="100%">
|
||||
<table id="example" class="row-border hover order-column" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -68,16 +64,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -266,7 +252,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -322,7 +308,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -536,6 +522,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -560,7 +556,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -635,6 +631,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -683,10 +682,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -741,6 +740,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -750,14 +752,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -914,7 +913,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,15 +3,12 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<title>DataTables examples - API</title>
|
||||
</head>
|
||||
<body class="dt-example">
|
||||
@@ -78,7 +75,7 @@
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Individual column searching (text inputs)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -17,14 +17,10 @@
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -36,20 +32,23 @@ $(document).ready(function() {
|
||||
} );
|
||||
|
||||
// DataTable
|
||||
var table = $('#example').DataTable();
|
||||
var table = $('#example').DataTable({
|
||||
initComplete: function () {
|
||||
// Apply the search
|
||||
this.api().columns().every( function () {
|
||||
var that = this;
|
||||
|
||||
// Apply the search
|
||||
table.columns().every( function () {
|
||||
var that = this;
|
||||
$( 'input', this.footer() ).on( 'keyup change clear', function () {
|
||||
if ( that.search() !== this.value ) {
|
||||
that
|
||||
.search( this.value )
|
||||
.draw();
|
||||
}
|
||||
} );
|
||||
} );
|
||||
}
|
||||
});
|
||||
|
||||
$( 'input', this.footer() ).on( 'keyup change', function () {
|
||||
if ( that.search() !== this.value ) {
|
||||
that
|
||||
.search( this.value )
|
||||
.draw();
|
||||
}
|
||||
} );
|
||||
} );
|
||||
} );
|
||||
|
||||
|
||||
@@ -60,20 +59,22 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Individual column searching (text inputs)</span></h1>
|
||||
<div class="info">
|
||||
<p>The searching functionality that is provided by DataTables is very useful for quickly search through the information in the table - however the search is
|
||||
global, and you may wish to present controls to search on specific columns only.</p>
|
||||
<p>The searching functionality provided by DataTables is useful for quickly search through the information in the table - however the search is global, and you may
|
||||
wish to present controls that search on specific columns.</p>
|
||||
<p>DataTables has the ability to apply searching to a specific column through the <a href="//datatables.net/reference/api/column().search()"><code class="api"
|
||||
title="DataTables API method">column().search()</code></a> method (note that the name of the method is <code>search</code> not <code>filter</code> since <a href=
|
||||
title="DataTables API method">column().search()</code></a> method (note that the name of the method is <code>search</code> not <code>filter</code>, since <a href=
|
||||
"//datatables.net/reference/api/filter()"><code class="api" title="DataTables API method">filter()</code></a> is used to apply a filter to a result set).</p>
|
||||
<p>The column searches are cumulative, so you can apply multiple individual column searches, in addition to the global search, allowing complex searching options
|
||||
to be presented to the user.</p>
|
||||
<p>This examples shows text elements being used with the <a href="//datatables.net/reference/api/column().search()"><code class="api" title=
|
||||
"DataTables API method">column().search()</code></a> method to add input controls in the footer of the table for each column. Note that the
|
||||
<code>*index*:visible</code> option is used for the column selector to ensure that the <a href="//datatables.net/reference/api/column()"><code class="api" title=
|
||||
"DataTables API method">column()</code></a> method takes into account any hidden columns when selecting the column to act upon.</p>
|
||||
"DataTables API method">column()</code></a> method takes into account any hidden columns when selecting the column to act upon. <a href=
|
||||
"//datatables.net/reference/option/initComplete"><code class="option" title="DataTables initialisation option">initComplete</code></a> is used to allow for any
|
||||
asynchronous actions, such as Ajax loading of data or language information.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -84,16 +85,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -282,7 +273,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -338,7 +329,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -552,6 +543,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -570,25 +571,28 @@ $(document).ready(function() {
|
||||
} );
|
||||
|
||||
// DataTable
|
||||
var table = $('#example').DataTable();
|
||||
var table = $('#example').DataTable({
|
||||
initComplete: function () {
|
||||
// Apply the search
|
||||
this.api().columns().every( function () {
|
||||
var that = this;
|
||||
|
||||
// Apply the search
|
||||
table.columns().every( function () {
|
||||
var that = this;
|
||||
$( 'input', this.footer() ).on( 'keyup change clear', function () {
|
||||
if ( that.search() !== this.value ) {
|
||||
that
|
||||
.search( this.value )
|
||||
.draw();
|
||||
}
|
||||
} );
|
||||
} );
|
||||
}
|
||||
});
|
||||
|
||||
$( 'input', this.footer() ).on( 'keyup change', function () {
|
||||
if ( that.search() !== this.value ) {
|
||||
that
|
||||
.search( this.value )
|
||||
.draw();
|
||||
}
|
||||
} );
|
||||
} );
|
||||
} );</code>
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -665,6 +669,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -713,10 +720,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -771,6 +778,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -780,14 +790,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -944,7 +951,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Individual column searching (select inputs)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -57,27 +53,30 @@ $(document).ready(function() {
|
||||
<div class="info">
|
||||
<p>This example is almost identical to text based individual column example and provides the same functionality, but in this case using <code class="tag" title=
|
||||
"HTML tag">select</code> input controls.</p>
|
||||
<p>After the table is initialised, the API is used to build the <code class="tag" title="HTML tag">select</code> inputs through the use of the <a href=
|
||||
"//datatables.net/reference/api/column().data()"><code class="api" title="DataTables API method">column().data()</code></a> method to get the data for each column
|
||||
in turn. The helper methods <a href="//datatables.net/reference/api/unique()"><code class="api" title="DataTables API method">unique()</code></a> and <a href=
|
||||
<p>After the table is initialised, the API is used to build the <code class="tag" title="HTML tag">select</code> inputs through the use of <a href=
|
||||
"//datatables.net/reference/api/columns().every()"><code class="api" title="DataTables API method">columns().every()</code></a> to loop over the columns (the
|
||||
<a href="//datatables.net/reference/api/columns()"><code class="api" title="DataTables API method">columns()</code></a> selector can also be used to limit the
|
||||
selected columns if required), then the <a href="//datatables.net/reference/api/column().data()"><code class="api" title=
|
||||
"DataTables API method">column().data()</code></a> method is used to get the data for each column in turn. The helper methods <a href=
|
||||
"//datatables.net/reference/api/unique()"><code class="api" title="DataTables API method">unique()</code></a> and <a href=
|
||||
"//datatables.net/reference/api/sort()"><code class="api" title="DataTables API method">sort()</code></a> are also used to reduce the data for set input to unique
|
||||
and ordered elements. Finally the <code>change</code> event from the <code class="tag" title="HTML tag">select</code> input is used to trigger a column search
|
||||
using the <a href="//datatables.net/reference/api/column().search()"><code class="api" title="DataTables API method">column().search()</code></a> method.</p>
|
||||
<p>Note that the <a href="//datatables.net/reference/api/column().search()"><code class="api" title="DataTables API method">column().search()</code></a> method in
|
||||
this particular case performs an exact match through the use of a custom regular expression and disabling DataTables built in smart searching. For more information
|
||||
on the search options in DataTables API please refer to the documentation for <a href="//datatables.net/reference/api/search()"><code class="api" title=
|
||||
this particular case performs an exact match through the use of a custom regular expression and disabling DataTables built-in smart searching. For more information
|
||||
on the search options in DataTables API, please refer to the documentation for <a href="//datatables.net/reference/api/search()"><code class="api" title=
|
||||
"DataTables API method">search()</code></a>, <a href="//datatables.net/reference/api/column().search()"><code class="api" title=
|
||||
"DataTables API method">column().search()</code></a> and <a href="//datatables.net/reference/api/%24.fn.dataTable.util.escapeRegex()"><code class="api" title=
|
||||
"DataTables API method">$.fn.dataTable.util.escapeRegex()</code></a> which are used for searching globally, by column and escaping regular expressions
|
||||
respectively.</p>
|
||||
<p>Note also that this example shows the use of <a href="//datatables.net/reference/option/initComplete"><code class="option" title=
|
||||
"DataTables initialisation option">initComplete</code></a> a callback function that is triggered when the table has fully loaded. Use of this callback isn't
|
||||
actually required in this example since the data is available in the table on load, but in the case of Ajax loaded data, <a href=
|
||||
<p>Also note this example demonstrates the use of <a href="//datatables.net/reference/option/initComplete"><code class="option" title=
|
||||
"DataTables initialisation option">initComplete</code></a>, a callback function triggered when the table has fully loaded. Use of this callback isn't required in
|
||||
this example since the data is available in the table on load, but in the case of Ajax loaded data, <a href=
|
||||
"//datatables.net/reference/option/initComplete"><code class="option" title="DataTables initialisation option">initComplete</code></a> is useful to execute code
|
||||
after the data has been loaded.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -88,16 +87,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -286,7 +275,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -342,7 +331,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -556,6 +545,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -593,7 +592,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -666,6 +665,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -714,10 +716,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -772,6 +774,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -781,14 +786,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -945,7 +947,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Search API (regular expressions)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -125,7 +121,7 @@ $(document).ready(function() {
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -136,16 +132,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -334,7 +320,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -390,7 +376,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -604,6 +590,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -644,7 +640,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -717,6 +713,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -765,10 +764,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -823,6 +822,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -832,14 +834,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -996,7 +995,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Child rows (show extra / detailed information)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -19,14 +19,10 @@ tr.shown td.details-control {
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -93,17 +89,17 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Child rows (show extra / detailed information)</span></h1>
|
||||
<div class="info">
|
||||
<p>The DataTables API has a number of methods available for attaching child rows to a <em>parent</em> row in the DataTable. This can be used to show additional
|
||||
information about a row, useful for cases where you wish to convey more information about a row than there is space for in the host table.</p>
|
||||
<p>The DataTables API has a number of methods for attaching child rows to a <em>parent</em> row in the DataTable. This can be used to show additional information
|
||||
about a row, useful for cases where you wish to convey more information about a row than there is space for in the host table.</p>
|
||||
<p>The example below makes use of the <a href="//datatables.net/reference/api/row().child"><code class="api" title="DataTables API method">row().child</code></a>
|
||||
methods to firstly check if a row is already displayed, and if so hide it (<a href="//datatables.net/reference/api/row().child.hide()"><code class="api" title=
|
||||
methods to first check if a row is already displayed, and if so hide it (<a href="//datatables.net/reference/api/row().child.hide()"><code class="api" title=
|
||||
"DataTables API method">row().child.hide()</code></a>), otherwise show it (<a href="//datatables.net/reference/api/row().child.show()"><code class="api" title=
|
||||
"DataTables API method">row().child.show()</code></a>). The content of the child row is, in this example, defined by the <code>formatDetails()</code> function, but
|
||||
you would replace that with whatever you wanted to show the content required, possibly including, for example, an Ajax call to the server to obtain the extra
|
||||
information to show.</p>
|
||||
"DataTables API method">row().child.show()</code></a>). The content of the child row in this example is defined by the <code>format()</code> function, but you
|
||||
would replace that with whatever content you wanted to show, possibly including, for example, <a href="https://www.datatables.net/blog/2017-03-31">an Ajax call to
|
||||
the server</a> to obtain any extra information.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
@@ -189,7 +185,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -268,6 +264,9 @@ tr.shown td.details-control {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -316,10 +315,10 @@ tr.shown td.details-control {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -374,6 +373,9 @@ tr.shown td.details-control {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -383,14 +385,11 @@ tr.shown td.details-control {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -547,7 +546,7 @@ tr.shown td.details-control {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Row selection (multiple rows)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -42,17 +38,17 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Row selection (multiple rows)</span></h1>
|
||||
<div class="info">
|
||||
<p>It can be quite useful at times to provide the user with the option to select rows in a DataTable. This can be done by simply using a click event to add /
|
||||
remove a class on the table rows. The <a href="//datatables.net/reference/api/rows().data()"><code class="api" title=
|
||||
"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 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>
|
||||
<p>It can be useful to provide the user with the option to select rows in a DataTable. This can be done by using a click event to add / remove a class on the table
|
||||
rows. The <a href="//datatables.net/reference/api/rows().data()"><code class="api" title="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 and easier to use row selection option, 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 that secletion.</p>
|
||||
</div>
|
||||
<div class="demo-html">
|
||||
<button id="button">Row count</button>
|
||||
</div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -63,16 +59,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -261,7 +247,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -317,7 +303,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -531,6 +517,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -555,7 +551,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -628,6 +624,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -676,10 +675,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -734,6 +733,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -743,14 +745,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -907,7 +906,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Row selection and deletion (single row)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -48,20 +44,19 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Row selection and deletion (single row)</span></h1>
|
||||
<div class="info">
|
||||
<p>This example shows a modification of the multiple row selection example, where just a single can now be selected. This is done simply by checking to see if the
|
||||
row already has a selected class or not, and if so removing it, if not then the class is removed from any other row in the table which does have it and applied to
|
||||
the row to be selected.</p>
|
||||
<p>This example modifies the multiple row selection example by only allowing the selection of a single row. This is done by checking to see if the row already has
|
||||
a selected class, and if so removing it, but if not then the class is removed from all other rows in the table and then applied to the row being selected.</p>
|
||||
<p>Also shown is the <a href="//datatables.net/reference/api/row().remove()"><code class="api" title="DataTables API method">row().remove()</code></a> method which
|
||||
will delete a row from a table, and the <a href="//datatables.net/reference/api/draw()"><code class="api" title="DataTables API method">draw()</code></a> method
|
||||
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
|
||||
deletes a row from a table, and the <a href="//datatables.net/reference/api/draw()"><code class="api" title="DataTables API method">draw()</code></a> method 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 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>
|
||||
<p>If you are looking for a more complete and easier to use row selection option, 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 that selection.</p>
|
||||
</div>
|
||||
<div class="demo-html">
|
||||
<button id="button">Delete selected row</button>
|
||||
</div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -72,16 +67,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -270,7 +255,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -326,7 +311,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -540,6 +525,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -570,7 +565,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -643,6 +638,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -691,10 +689,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -749,6 +747,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -758,14 +759,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -922,7 +920,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Show / hide columns dynamically</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -49,12 +45,12 @@ $(document).ready(function() {
|
||||
<div class="info">
|
||||
<p>This example shows how you can make use of the <a href="//datatables.net/reference/api/column().visible()"><code class="api" title=
|
||||
"DataTables API method">column().visible()</code></a> API method to dynamically show and hide columns in a table. Also included here is scrolling, just to show it
|
||||
enabled with this API method, although that is not required for the API function to work.</p>
|
||||
<p>In addition to this, groups of columns can be shown and hidden at the same time using the <a href="//datatables.net/reference/api/columns()"><code class="api"
|
||||
title="DataTables API method">columns()</code></a> method to select multiple columns and then using the <a href=
|
||||
enabled with this API method, although it's not required for the API function to work.</p>
|
||||
<p>In addition, groups of columns can be shown and hidden at the same time using the <a href="//datatables.net/reference/api/columns()"><code class="api" 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, check out the <a href="https://datatables.net/extras/buttons">Buttons extension
|
||||
for DataTables</a> provides a comprehensive module for column visibility control.</p>
|
||||
<p>If you are looking for a more complete column visibility interaction controls, the <a href="https://datatables.net/extras/buttons">Buttons extension for
|
||||
DataTables</a> provides a comprehensive module for column visibility control.</p>
|
||||
</div>
|
||||
<div class="demo-html">
|
||||
<div>
|
||||
@@ -63,7 +59,7 @@ $(document).ready(function() {
|
||||
"5">Salary</a>
|
||||
</div>
|
||||
</div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -74,16 +70,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -272,7 +258,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -328,7 +314,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -542,6 +528,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -571,7 +567,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -644,6 +640,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -692,10 +691,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -750,6 +749,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -759,14 +761,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -923,7 +922,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,27 +3,21 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Scrolling and Bootstrap tabs</title>
|
||||
<link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/dataTables.bootstrap.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/dataTables.bootstrap.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/dataTables.bootstrap.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -130,10 +124,10 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js</a>
|
||||
<a href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -154,7 +148,8 @@ $(document).ready(function() {
|
||||
<p>The following CSS library files are loaded for use in this example to provide the styling of the table:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css</a>
|
||||
<a href=
|
||||
"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/css/dataTables.bootstrap.css">../../media/css/dataTables.bootstrap.css</a>
|
||||
@@ -212,6 +207,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -260,10 +258,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -318,6 +316,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -327,14 +328,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -491,7 +489,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Alternative pagination</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -46,7 +42,7 @@ $(document).ready(function() {
|
||||
<li><code class="string" title="String">full_numbers</code> - 'First', 'Previous', 'Next' and 'Last' buttons, plus page numbers</li>
|
||||
<li><code class="string" title="String">first_last_numbers</code> - 'First' and 'Last' buttons, plus page numbers</li>
|
||||
</ul>
|
||||
<p>The language strings of 'First', 'Previous' etc can be optionally through the internationalisation options of DataTables; <a href=
|
||||
<p>The language strings of 'First', 'Previous' etc can be optionally changed through the internationalisation options of DataTables; <a href=
|
||||
"//datatables.net/reference/option/language.paginate.first"><code class="option" title="DataTables initialisation option">language.paginate.first</code></a>,
|
||||
<a href="//datatables.net/reference/option/language.paginate.previous"><code class="option" title=
|
||||
"DataTables initialisation option">language.paginate.previous</code></a> etc.</p>
|
||||
@@ -55,7 +51,7 @@ $(document).ready(function() {
|
||||
<p>The example below shows the <code class="string" title="String">full_numbers</code> type of pagination.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -66,16 +62,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -264,7 +250,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -320,7 +306,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -534,6 +520,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -552,7 +548,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -625,6 +621,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li class="active">
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -673,10 +672,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -731,6 +730,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -740,14 +742,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -904,7 +903,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Language - Comma decimal place</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -51,7 +47,7 @@ $(document).ready(function() {
|
||||
<p>The example below shows a comma being used as the decimal place in the currency numbers shown in the final column.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -62,16 +58,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -260,7 +246,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85.600,00</td>
|
||||
@@ -316,7 +302,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95.400,00</td>
|
||||
@@ -530,6 +516,16 @@ $(document).ready(function() {
|
||||
<td>$112.000,00</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -551,7 +547,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -624,6 +620,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -672,10 +671,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -730,6 +729,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -739,14 +741,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -903,7 +902,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Complex headers (rowspan and colspan)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -40,7 +36,7 @@ $(document).ready(function() {
|
||||
<p>The example shown below has two sets of grouped information, grouped by colspan in the header.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th rowspan="2">Name</th>
|
||||
@@ -55,16 +51,6 @@ $(document).ready(function() {
|
||||
<th>E-mail</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Salary</th>
|
||||
<th>Office</th>
|
||||
<th>Extn.</th>
|
||||
<th>E-mail</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -254,7 +240,7 @@ $(document).ready(function() {
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>$85,600</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>3023</td>
|
||||
<td>d.wilder@datatables.net</td>
|
||||
</tr>
|
||||
@@ -310,7 +296,7 @@ $(document).ready(function() {
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>$95,400</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>2769</td>
|
||||
<td>m.house@datatables.net</td>
|
||||
</tr>
|
||||
@@ -523,6 +509,16 @@ $(document).ready(function() {
|
||||
<td>d.snider@datatables.net</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Salary</th>
|
||||
<th>Office</th>
|
||||
<th>Extn.</th>
|
||||
<th>E-mail</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -539,7 +535,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -612,6 +608,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -660,10 +659,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -718,6 +717,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -727,14 +729,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -891,7 +890,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
582
examples/basic_init/data_rendering.html
Normal file
582
examples/basic_init/data_rendering.html
Normal file
@@ -0,0 +1,582 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Data rendering</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="https://github.com/downloads/lafeber/world-flags-sprite/flags32.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
|
||||
<style type="text/css" class="init">
|
||||
|
||||
.f32 .flag {
|
||||
vertical-align: middle;
|
||||
margin: -8px 0;
|
||||
}
|
||||
|
||||
progress {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
$('#example').DataTable({
|
||||
ajax: '../ajax/data/objects_salary.txt',
|
||||
columns: [
|
||||
{
|
||||
data: 'name'
|
||||
},
|
||||
{
|
||||
data: 'position'
|
||||
},
|
||||
{
|
||||
className: 'f32', // used by world-flags-sprite library
|
||||
data: 'office',
|
||||
render: function(data, type) {
|
||||
if (type === 'display') {
|
||||
var country = '';
|
||||
|
||||
switch (data) {
|
||||
case 'Argentina':
|
||||
country = 'ar';
|
||||
break;
|
||||
case 'Edinburgh':
|
||||
country = '_Scotland';
|
||||
break;
|
||||
case 'London':
|
||||
country = '_England';
|
||||
break;
|
||||
case 'New York':
|
||||
case 'San Francisco':
|
||||
country = 'us';
|
||||
break;
|
||||
case 'Sydney':
|
||||
country = 'au';
|
||||
break;
|
||||
case 'Tokyo':
|
||||
country = 'jp';
|
||||
break;
|
||||
}
|
||||
|
||||
return '<span class="flag ' + country + '"></span> ' + data;
|
||||
}
|
||||
|
||||
return data;
|
||||
}
|
||||
},
|
||||
{
|
||||
data: 'extn',
|
||||
render: function(data, type, row, meta) {
|
||||
return type === 'display' ?
|
||||
'<progress value="' + data + '" max="9999"></progress>' :
|
||||
data;
|
||||
}
|
||||
},
|
||||
{
|
||||
data: "start_date"
|
||||
},
|
||||
{
|
||||
data: "salary",
|
||||
render: $.fn.dataTable.render.number( ',', '.', 2, '$' )
|
||||
}
|
||||
]
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body class="dt-example">
|
||||
<div class="container">
|
||||
<section>
|
||||
<h1>DataTables example <span>Data rendering</span></h1>
|
||||
<div class="info">
|
||||
<p>Data within DataTables can be easily rendered to add graphics or colour to your tables, as demonstrated in the example on this page. These examples make use of
|
||||
<a href="//datatables.net/reference/option/columns.render"><code class="option" title="DataTables initialisation option">columns.render</code></a> to customise the
|
||||
cells in three ways:</p>
|
||||
<ul class="markdown">
|
||||
<li>A flag is added to the <em>Office</em> column</li>
|
||||
<li>a HTML5 progress bar is added to the <em>Progress</em> column</li>
|
||||
<li>and the built-in number renderer is used for format the <em>Salary</em>.</li>
|
||||
</ul>
|
||||
<p>See the <a href="https://datatables.net/manual/data/renderers">data rendering manual page</a> for more details on how to use data renderers. Also, this example
|
||||
uses <a href="https://datatables.net/manual/ajax">Ajax to load the data</a>. More <a href="../ajax">Ajax examples are available</a>.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display nowrap" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Progress</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Progress</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
<li>HTML</li>
|
||||
<li>CSS</li>
|
||||
<li>Ajax</li>
|
||||
<li>Server-side script</li>
|
||||
</ul>
|
||||
<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({
|
||||
ajax: '../ajax/data/objects_salary.txt',
|
||||
columns: [
|
||||
{
|
||||
data: 'name'
|
||||
},
|
||||
{
|
||||
data: 'position'
|
||||
},
|
||||
{
|
||||
className: 'f32', // used by world-flags-sprite library
|
||||
data: 'office',
|
||||
render: function(data, type) {
|
||||
if (type === 'display') {
|
||||
var country = '';
|
||||
|
||||
switch (data) {
|
||||
case 'Argentina':
|
||||
country = 'ar';
|
||||
break;
|
||||
case 'Edinburgh':
|
||||
country = '_Scotland';
|
||||
break;
|
||||
case 'London':
|
||||
country = '_England';
|
||||
break;
|
||||
case 'New York':
|
||||
case 'San Francisco':
|
||||
country = 'us';
|
||||
break;
|
||||
case 'Sydney':
|
||||
country = 'au';
|
||||
break;
|
||||
case 'Tokyo':
|
||||
country = 'jp';
|
||||
break;
|
||||
}
|
||||
|
||||
return '<span class="flag ' + country + '"></span> ' + data;
|
||||
}
|
||||
|
||||
return data;
|
||||
}
|
||||
},
|
||||
{
|
||||
data: 'extn',
|
||||
render: function(data, type, row, meta) {
|
||||
return type === 'display' ?
|
||||
'<progress value="' + data + '" max="9999"></progress>' :
|
||||
data;
|
||||
}
|
||||
},
|
||||
{
|
||||
data: "start_date"
|
||||
},
|
||||
{
|
||||
data: "salary",
|
||||
render: $.fn.dataTable.render.number( ',', '.', 2, '$' )
|
||||
}
|
||||
]
|
||||
});
|
||||
});</code>
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="table">
|
||||
<p>The HTML shown below is the raw HTML table element, before it has been enhanced by DataTables:</p>
|
||||
</div>
|
||||
<div class="css">
|
||||
<div>
|
||||
<p>This example uses a little bit of additional CSS beyond what is loaded from the library files (below), in order to correctly display the table. The
|
||||
additional CSS used is shown below:</p><code class="multiline language-css">.f32 .flag {
|
||||
vertical-align: middle;
|
||||
margin: -8px 0;
|
||||
}
|
||||
|
||||
progress {
|
||||
width: 100%;
|
||||
}</code>
|
||||
</div>
|
||||
<p>The following CSS library files are loaded for use in this example to provide the styling of the table:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="../../media/css/jquery.dataTables.css">../../media/css/jquery.dataTables.css</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/downloads/lafeber/world-flags-sprite/flags32.css">https://github.com/downloads/lafeber/world-flags-sprite/flags32.css</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="ajax">
|
||||
<p>This table loads data by Ajax. The latest data that has been loaded is shown below. This data will update automatically as any additional data is
|
||||
loaded.</p>
|
||||
</div>
|
||||
<div class="php">
|
||||
<p>The script used to perform the server-side processing for this table is shown below. Please note that this is just an example script using PHP. Server-side
|
||||
processing scripts can be written in any language, using <a href="//datatables.net/manual/server-side">the protocol described in the DataTables
|
||||
documentation</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<section>
|
||||
<div class="footer">
|
||||
<div class="gradient"></div>
|
||||
<div class="liner">
|
||||
<h2>Other examples</h2>
|
||||
<div class="toc">
|
||||
<div class="toc-group">
|
||||
<h3><a href="./index.html">Basic initialisation</a></h3>
|
||||
<ul class="toc active">
|
||||
<li>
|
||||
<a href="./zero_configuration.html">Zero configuration</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./filter_only.html">Feature enable / disable</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./table_sorting.html">Default ordering (sorting)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./multi_col_sort.html">Multi-column ordering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./multiple_tables.html">Multiple tables</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./hidden_columns.html">Hidden columns</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./complex_header.html">Complex headers (rowspan and colspan)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./dom.html">DOM positioning</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./flexible_width.html">Flexible table width</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li class="active">
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./scroll_y.html">Scroll - vertical</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./scroll_y_dynamic.html">Scroll - vertical, dynamic height</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./scroll_x.html">Scroll - horizontal</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./scroll_xy.html">Scroll - horizontal and vertical</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./comma-decimal.html">Language - Comma decimal place</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./language.html">Language options</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="toc-group">
|
||||
<h3><a href="../advanced_init/index.html">Advanced initialisation</a></h3>
|
||||
<ul class="toc">
|
||||
<li>
|
||||
<a href="../advanced_init/events_live.html">DOM / jQuery events</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/dt_events.html">DataTables events</a>
|
||||
</li>
|
||||
<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 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>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/defaults.html">Setting defaults</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/row_callback.html">Row created callback</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/row_grouping.html">Row grouping</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/footer_callback.html">Footer callback</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/dom_toolbar.html">Custom toolbar elements</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/sort_direction_control.html">Order direction sequence control</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="toc-group">
|
||||
<h3><a href="../styling/index.html">Styling</a></h3>
|
||||
<ul class="toc">
|
||||
<li>
|
||||
<a href="../styling/display.html">Base style</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/no-classes.html">Base style - no styling classes</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/cell-border.html">Base style - cell borders</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/compact.html">Base style - compact</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/hover.html">Base style - hover</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/order-column.html">Base style - order-column</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/row-border.html">Base style - row borders</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/stripe.html">Base style - stripe</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/semanticui.html">Semantic UI</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="toc-group">
|
||||
<h3><a href="../data_sources/index.html">Data sources</a></h3>
|
||||
<ul class="toc">
|
||||
<li>
|
||||
<a href="../data_sources/dom.html">HTML (DOM) sourced data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../data_sources/ajax.html">Ajax sourced data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../data_sources/js_array.html">Javascript sourced data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../data_sources/server_side.html">Server-side processing</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="toc-group">
|
||||
<h3><a href="../api/index.html">API</a></h3>
|
||||
<ul class="toc">
|
||||
<li>
|
||||
<a href="../api/add_row.html">Add rows</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/multi_filter.html">Individual column searching (text inputs)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/multi_filter_select.html">Individual column searching (select inputs)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/highlight.html">Highlighting rows and columns</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/row_details.html">Child rows (show extra / detailed information)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/select_row.html">Row selection (multiple rows)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/select_single_row.html">Row selection and deletion (single row)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/form.html">Form inputs</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/counter_columns.html">Index column</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/show_hide.html">Show / hide columns dynamically</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/api_in_init.html">Using API in callbacks</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/tabs_and_scrolling.html">Scrolling and Bootstrap tabs</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../api/regex.html">Search API (regular expressions)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="toc-group">
|
||||
<h3><a href="../ajax/index.html">Ajax</a></h3>
|
||||
<ul class="toc">
|
||||
<li>
|
||||
<a href="../ajax/simple.html">Ajax data source (arrays)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../ajax/objects.html">Ajax data source (objects)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../ajax/deep.html">Nested object data (objects)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../ajax/objects_subarrays.html">Nested object data (arrays)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../ajax/orthogonal-data.html">Orthogonal data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../ajax/null_data_source.html">Generated content for a column</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../ajax/custom_data_property.html">Custom data source property</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../ajax/custom_data_flat.html">Flat array data source</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../ajax/defer_render.html">Deferred rendering for speed</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="toc-group">
|
||||
<h3><a href="../server_side/index.html">Server-side</a></h3>
|
||||
<ul class="toc">
|
||||
<li>
|
||||
<a href="../server_side/simple.html">Server-side processing</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../server_side/custom_vars.html">Custom HTTP variables</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../server_side/post.html">POST data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../server_side/ids.html">Automatic addition of row ID attributes</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../server_side/object_data.html">Object data source</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../server_side/row_details.html">Row details</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../server_side/select_rows.html">Row selection</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../server_side/jsonp.html">JSONP data source for remote domains</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../server_side/defer_loading.html">Deferred loading of data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../server_side/pipeline.html">Pipelining data to reduce Ajax calls for paging</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="toc-group">
|
||||
<h3><a href="../plug-ins/index.html">Plug-ins</a></h3>
|
||||
<ul class="toc">
|
||||
<li>
|
||||
<a href="../plug-ins/api.html">API plug-in methods</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../plug-ins/sorting_auto.html">Ordering plug-ins (with type detection)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../plug-ins/sorting_manual.html">Ordering plug-ins (no type detection)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../plug-ins/range_filtering.html">Custom filtering - range search</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../plug-ins/dom_sort.html">Live DOM ordering</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="epilogue">
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - DOM positioning</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -89,7 +85,7 @@ $(document).ready(function() {
|
||||
<code>div</code>.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -100,16 +96,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -298,7 +284,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -354,7 +340,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -568,6 +554,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -586,7 +582,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -659,6 +655,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -707,10 +706,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -765,6 +764,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -774,14 +776,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -938,7 +937,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Feature enable / disable</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -36,12 +32,12 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Feature enable / disable</span></h1>
|
||||
<div class="info">
|
||||
<p>Disabling features that you don't wish to use for a particular table is easily done by setting a variable in the initialisation object. A full list of the
|
||||
options that can be used is <a href="https://datatables.net/reference/option">available in the DataTables reference</a>.</p>
|
||||
<p>Disabling features that you don't wish to use for a particular table is easily done by setting a variable in the initialisation object. The full list of
|
||||
available options is <a href="https://datatables.net/reference/option">available in the DataTables reference</a>.</p>
|
||||
<p>In the following example only the search feature is left enabled (which it is by default).</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -52,16 +48,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -250,7 +236,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -306,7 +292,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -520,6 +506,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -540,7 +536,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -613,6 +609,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -661,10 +660,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -719,6 +718,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -728,14 +730,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -892,7 +891,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Flexible table width</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -15,14 +15,10 @@
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -40,11 +36,11 @@ $(document).ready(function() {
|
||||
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 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
|
||||
<p>This example shows a table with <code>width="80%"</code> and the container is also flexible width, so as the window is resized, the table will also resize
|
||||
dynamically.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -55,16 +51,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -253,7 +239,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -309,7 +295,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -523,6 +509,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -539,7 +535,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -614,6 +610,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -662,10 +661,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -720,6 +719,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -729,14 +731,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -893,7 +892,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Hidden columns</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -55,7 +51,7 @@ $(document).ready(function() {
|
||||
<p>In the table below both the office and age version columns have been hidden, the former is not searchable, the latter is.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -66,16 +62,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -264,7 +250,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -320,7 +306,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -534,6 +520,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -562,7 +558,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -635,6 +631,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -683,10 +682,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -741,6 +740,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -750,14 +752,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -914,7 +913,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,15 +3,12 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<title>DataTables examples - Basic initialisation</title>
|
||||
</head>
|
||||
<body class="dt-example">
|
||||
@@ -19,7 +16,7 @@
|
||||
<section>
|
||||
<h1>DataTables example <span>Basic initialisation</span></h1>
|
||||
<div class="info">
|
||||
<p>DataTables is very simple to use as a jQuery plug-in with a huge range of customisable option. The examples in this section demonstrate basic initialisation of
|
||||
<p>DataTables is a simple-to-use jQuery plug-in with a huge range of customisable options. The examples in this section demonstrate basic initialisation of
|
||||
DataTables and how it can be easily customised by passing an object with the options you want.</p>
|
||||
</div>
|
||||
</section>
|
||||
@@ -62,6 +59,9 @@
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -90,7 +90,7 @@
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Language options</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -42,10 +38,10 @@ $(document).ready(function() {
|
||||
<div class="info">
|
||||
<p>Changing the language information displayed by DataTables is as simple as passing in a <a href="//datatables.net/reference/option/language"><code class="option"
|
||||
title="DataTables initialisation option">language</code></a> object to the DataTable constructor.</p>
|
||||
<p>The example above shows a different set of English string being used, rather than the defaults.</p>
|
||||
<p>This example shows a different set of English string being used, rather than the defaults.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -56,16 +52,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -254,7 +240,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -310,7 +296,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -524,6 +510,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -548,7 +544,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -621,6 +617,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -669,10 +668,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -727,6 +726,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -736,14 +738,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -900,7 +899,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Multi-column ordering</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -62,7 +58,7 @@ $(document).ready(function() {
|
||||
directly to the first and the salary column to the first name column.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -238,7 +234,7 @@ $(document).ready(function() {
|
||||
<td>Doris</td>
|
||||
<td>Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>$85,600</td>
|
||||
</tr>
|
||||
<tr>
|
||||
@@ -287,7 +283,7 @@ $(document).ready(function() {
|
||||
<td>Michelle</td>
|
||||
<td>House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>$95,400</td>
|
||||
</tr>
|
||||
<tr>
|
||||
@@ -500,7 +496,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -573,6 +569,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -621,10 +620,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -679,6 +678,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -688,14 +690,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -852,7 +851,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Multiple tables</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -15,14 +15,10 @@
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -45,7 +41,7 @@ $(document).ready(function() {
|
||||
which have the class of <code>table.display</code> (which is suitable in this example, you might wish to use a different selector).</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="" class="display" cellspacing="0" width="100%">
|
||||
<table id="" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -55,15 +51,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -129,17 +116,6 @@ $(document).ready(function() {
|
||||
<td>$183,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<table id="" class="display" cellspacing="0" width="100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -149,6 +125,17 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<table id="" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Jena Gaines</td>
|
||||
@@ -235,6 +222,15 @@ $(document).ready(function() {
|
||||
<td>$103,500</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -251,7 +247,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -326,6 +322,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -374,10 +373,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -432,6 +431,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -441,14 +443,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -605,7 +604,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Scroll - horizontal</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -16,14 +16,10 @@
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -47,7 +43,7 @@ $(document).ready(function() {
|
||||
also set to have the text content of each row on a single line (otherwise the browser will line break the text to have it fit into the available area).</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display nowrap" cellspacing="0" width="100%">
|
||||
<table id="example" class="display nowrap" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -319,7 +315,7 @@ $(document).ready(function() {
|
||||
<td>Doris</td>
|
||||
<td>Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -396,7 +392,7 @@ $(document).ready(function() {
|
||||
<td>Michelle</td>
|
||||
<td>House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -708,7 +704,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -784,6 +780,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -832,10 +831,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -890,6 +889,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -899,14 +901,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -1063,7 +1062,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Scroll - horizontal and vertical</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -16,14 +16,10 @@
|
||||
}
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -44,7 +40,7 @@ $(document).ready(function() {
|
||||
the scrolling accounts for this.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display nowrap" cellspacing="0" width="100%">
|
||||
<table id="example" class="display nowrap" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -316,7 +312,7 @@ $(document).ready(function() {
|
||||
<td>Doris</td>
|
||||
<td>Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -393,7 +389,7 @@ $(document).ready(function() {
|
||||
<td>Michelle</td>
|
||||
<td>House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -706,7 +702,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -782,6 +778,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -830,10 +829,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -888,6 +887,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -897,14 +899,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -1061,7 +1060,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Scroll - vertical</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -48,7 +44,7 @@ $(document).ready(function() {
|
||||
"DataTables initialisation option">scrollY</code></a>.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -59,16 +55,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -257,7 +243,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -313,7 +299,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -527,6 +513,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -547,7 +543,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -620,6 +616,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -668,10 +667,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -726,6 +725,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -735,14 +737,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -899,7 +898,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Scroll - vertical, dynamic height</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -44,7 +40,7 @@ $(document).ready(function() {
|
||||
<code>vh</code> unit and all other evergreen browsers.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -55,16 +51,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -253,7 +239,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -309,7 +295,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -523,6 +509,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -543,7 +539,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -616,6 +612,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -664,10 +663,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -722,6 +721,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -731,14 +733,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -895,7 +894,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - State saving</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -49,7 +45,7 @@ $(document).ready(function() {
|
||||
"DataTables initialisation option">stateSave</code></a> option.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -60,16 +56,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -258,7 +244,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -314,7 +300,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -528,6 +514,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -546,7 +542,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -619,6 +615,9 @@ $(document).ready(function() {
|
||||
<li class="active">
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -667,10 +666,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -725,6 +724,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -734,14 +736,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -898,7 +897,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Default ordering (sorting)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -44,7 +40,7 @@ $(document).ready(function() {
|
||||
<p>The table below is ordered (descending) by the Age column.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -55,16 +51,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -253,7 +239,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -309,7 +295,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -523,6 +509,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -541,7 +537,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -614,6 +610,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -662,10 +661,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -720,6 +719,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -729,14 +731,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -893,7 +892,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Zero configuration</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -39,7 +35,7 @@ $(document).ready(function() {
|
||||
<p>Searching, ordering and paging goodness will be immediately added to the table, as shown in this example.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -50,16 +46,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -248,7 +234,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -304,7 +290,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -518,6 +504,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -534,7 +530,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -607,6 +603,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="./state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -655,10 +654,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -713,6 +712,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -722,14 +724,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -886,7 +885,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Ajax sourced data</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -46,7 +42,7 @@ $(document).ready(function() {
|
||||
"//datatables.net/reference/option/columns.data"><code class="option" title="DataTables initialisation option">columns.data</code></a> option ).</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -85,7 +81,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -158,6 +154,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -206,10 +205,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -264,6 +263,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -273,14 +275,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -437,7 +436,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - HTML (DOM) sourced data</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -37,10 +33,10 @@ $(document).ready(function() {
|
||||
<p>The foundation for DataTables is progressive enhancement, so it is very adept at reading table information directly from the DOM. This example shows how easy it
|
||||
is to add searching, ordering and paging to your HTML table by simply running DataTables on it.</p>
|
||||
<p>For further and more complex examples of using DataTables with DOM sourced data, please refer to the <a href="../basic_init">basic initialisation</a> and
|
||||
<a href="../advanced_init">advanced</a> examples.</p>
|
||||
<a href="../advanced_init">advanced initialisation</a> examples.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -51,16 +47,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -249,7 +235,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -305,7 +291,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -519,6 +505,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -535,7 +531,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -608,6 +604,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -656,10 +655,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -714,6 +713,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -723,14 +725,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -887,7 +886,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,15 +3,12 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<title>DataTables examples - Data sources</title>
|
||||
</head>
|
||||
<body class="dt-example">
|
||||
@@ -26,8 +23,8 @@
|
||||
<li>Ajax sourced data with client-side processing</li>
|
||||
<li>Ajax sourced data with server-side processing</li>
|
||||
</ul>
|
||||
<p>Which of these options is used to populate the table with data depends upon how the table is initialised. The examples in this section show these four different
|
||||
data source types.</p>
|
||||
<p>Which of these options is used to populate the table data depends upon how the table is initialised. The examples in this section show these four different data
|
||||
source types.</p>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
@@ -58,7 +55,7 @@
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Javascript sourced data</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -46,14 +42,14 @@ var dataSet = [
|
||||
[ "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" ],
|
||||
[ "Doris Wilder", "Sales Assistant", "Sydney", "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" ],
|
||||
[ "Michelle House", "Integration Specialist", "Sydney", "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" ],
|
||||
@@ -127,14 +123,14 @@ $(document).ready(function() {
|
||||
[ "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" ],
|
||||
[ "Doris Wilder", "Sales Assistant", "Sydney", "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" ],
|
||||
[ "Michelle House", "Integration Specialist", "Sydney", "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" ],
|
||||
@@ -158,7 +154,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -231,6 +227,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -279,10 +278,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -337,6 +336,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -346,14 +348,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -510,7 +509,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Server-side processing</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -47,7 +43,7 @@ $(document).ready(function() {
|
||||
using server-side processing, please refer to the <a href="../server_side">server-side processing</a> examples.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -88,7 +84,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -161,6 +157,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -209,10 +208,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -267,6 +266,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -276,14 +278,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -440,7 +439,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,15 +3,12 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<link rel="stylesheet" type="text/css" href="./resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="./resources/demo.css">
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="./resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="./resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="./resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="./resources/demo.js"></script>
|
||||
<title>DataTables examples - Examples index</title>
|
||||
</head>
|
||||
<body class="dt-example">
|
||||
@@ -63,6 +60,9 @@
|
||||
<li>
|
||||
<a href="./basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -111,10 +111,10 @@
|
||||
<a href="./advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="./advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="./advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./advanced_init/language_file.html">Language file</a>
|
||||
@@ -169,6 +169,9 @@
|
||||
<li>
|
||||
<a href="./styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -178,14 +181,11 @@
|
||||
<li>
|
||||
<a href="./styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="./styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -342,7 +342,7 @@
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - API plug-in methods</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -57,7 +53,7 @@ $(document).ready(function() {
|
||||
<div class="info">
|
||||
<p>The DataTables API is designed to be fully extensible, with custom functions being very easy to add using the <code>$.fn.dataTable.Api.register</code> function.
|
||||
This function takes two arguments; the first being the name of the method to be added and its chaining hierarchy, and the second the function itself.</p>
|
||||
<p>This example shows how a <code>sum()</code> method can easily be added to the Api so you can get the sum of a column in a single line:
|
||||
<p>This example shows how a <code>sum()</code> method can easily be added to the API so you can get the sum of a column in a single line:
|
||||
<code>table.column().data().sum()</code>. Due to the chaining of the methods, this allows <code>sum()</code> to very easily give the sum for any selected column,
|
||||
and to limit the sum to just the current page, filtered data or all pages. This is done using the options for the <a href=
|
||||
"//datatables.net/reference/api/column()"><code class="api" title="DataTables API method">column()</code></a> method and the options for its selectors.</p>
|
||||
@@ -66,7 +62,7 @@ $(document).ready(function() {
|
||||
<div class="demo-html">
|
||||
<div id="demo"></div>
|
||||
</div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -77,16 +73,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -275,7 +261,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -331,7 +317,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -545,6 +531,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -582,7 +578,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -655,6 +651,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -703,10 +702,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -761,6 +760,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -770,14 +772,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -934,7 +933,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Live DOM ordering</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -74,19 +70,19 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Live DOM ordering</span></h1>
|
||||
<div class="info">
|
||||
<p>This example shows how you can use information available in the DOM to order columns. Typically DataTables will read information to be ordered during it's
|
||||
<p>This example shows how you can use information available in the DOM to order columns. Typically DataTables will read information to be ordered during its
|
||||
initialisation phase, and this will not be updated based on user interaction, so ordering on columns which have, for example, form elements in them, may not
|
||||
reflect the current value of the input. To overcome this problem, you must update the data that DataTables will order on, just prior to the order. This method is
|
||||
much more efficient than actually ordering using the DOM, since only one DOM query is needed for each cell to be ordered.</p>
|
||||
<p>The example below shows the first two columns as normal text with ordering as you would expect. The following columns all have a form input element of different
|
||||
<p>The example below shows the first column as normal text with ordering as you would expect. The following columns all have a form input element of different
|
||||
kinds, and the information contained within is what DataTables will perform the order on, based on the value at the time of the order.</p>
|
||||
<p>This is a fairly simple example, but it you aren't constrained to just using form input elements, you could use anything and customise your DOM queries to suit
|
||||
yourself. You could also update the ordering live as a user in entered data into a form using an event handler calling <a href=
|
||||
<p>This is a fairly simple example, but you aren't constrained to just using form input elements, you could use anything and customise your DOM queries to suit
|
||||
yourself. You could also update the ordering live as a user enters data into a form by using an event handler calling <a href=
|
||||
"//datatables.net/reference/api/order()"><code class="api" title="DataTables API method">order()</code></a> or <a href=
|
||||
"//datatables.net/reference/api/draw()"><code class="api" title="DataTables API method">draw()</code></a> methods.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -95,14 +91,6 @@ $(document).ready(function() {
|
||||
<th>Office</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Age</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -1359,6 +1347,14 @@ $(document).ready(function() {
|
||||
</select></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Age</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -1415,7 +1411,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -1488,6 +1484,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -1536,10 +1535,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -1594,6 +1593,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -1603,14 +1605,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -1767,7 +1766,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,15 +3,12 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<title>DataTables examples - Plug-ins</title>
|
||||
</head>
|
||||
<body class="dt-example">
|
||||
@@ -56,7 +53,7 @@
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Custom filtering - range search</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -57,8 +53,8 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Custom filtering - range search</span></h1>
|
||||
<div class="info">
|
||||
<p>There may be occasions when you wish to search data presented to the end user in your own manner, common examples are number range search (in between two
|
||||
numbers) and date range search. DataTables provide an API method to add your own search functions, <code>$.fn.dataTable.ext.search</code>. This is an array of
|
||||
<p>There may be occasions when you wish to search data presented to the end user in your own manner, common examples are number range searches (in between two
|
||||
numbers) and date range searches. DataTables provides an API method to add your own search functions, <code>$.fn.dataTable.ext.search</code>. This is an array of
|
||||
functions (push your own onto it) which will will be run at table draw time to see if a particular row should be included or not.</p>
|
||||
<p>This example shows a search being performed on the age column in the data, based upon two inputs.</p>
|
||||
</div>
|
||||
@@ -74,7 +70,7 @@ $(document).ready(function() {
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -85,16 +81,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -283,7 +269,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>$85,600</td>
|
||||
@@ -339,7 +325,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>$95,400</td>
|
||||
@@ -553,6 +539,16 @@ $(document).ready(function() {
|
||||
<td>$112,000</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -592,7 +588,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -665,6 +661,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -713,10 +712,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -771,6 +770,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -780,14 +782,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -944,7 +943,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Ordering plug-ins (with type detection)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -52,16 +48,15 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Ordering plug-ins (with type detection)</span></h1>
|
||||
<div class="info">
|
||||
<p>Although DataTables will automatically order data from a number of different data types using the built in methods, When dealing with more complex formatted
|
||||
data, it can be desirable to define the ordering order yourself. Using plug-in ordering functions, you have have DataTables sort data in any manner you wish.</p>
|
||||
<p>Although DataTables will automatically order data from a number of different data types using the built in methods, when dealing with more complex formatted
|
||||
data, it can be desirable to define the ordering order yourself. Using plug-in ordering functions, you can have DataTables sort data in any manner you wish.</p>
|
||||
<p>Formatted data of a particular kind can be automatically detected and a suitable ordering plug-in assigned to it by making use of DataTables' plug-in type
|
||||
detection abilities. For complete information about type detection and ordering plug-ins; creating them and their requirements, please refer to the plug-in
|
||||
development documentation.</p>
|
||||
detection abilities. For more information about ordering plug-ins, creating them and their requirements, please refer to the plug-in development documentation.</p>
|
||||
<p>This example shows ordering with using an enumerated type.</p>
|
||||
<p>A wide variety of ready made ordering plug-ins can be found on <a href="//datatables.net/plug-ins/sorting">the DataTables plug-ins page</a>.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -72,16 +67,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -270,7 +255,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>Low</td>
|
||||
@@ -326,7 +311,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>Low</td>
|
||||
@@ -540,6 +525,16 @@ $(document).ready(function() {
|
||||
<td>Low</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -574,7 +569,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -647,6 +642,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -695,10 +693,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -753,6 +751,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -762,14 +763,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -926,7 +924,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Ordering plug-ins (no type detection)</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -48,18 +44,18 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>Ordering plug-ins (no type detection)</span></h1>
|
||||
<div class="info">
|
||||
<p>Although DataTables will order a number of data types using the built in methods, When dealing with more complex formatted data, it can be desirable to define
|
||||
the ordering order yourself. Using plug-in ordering functions, you have have DataTables order data in any manner you wish.</p>
|
||||
<p>Although DataTables will order a number of data types using the built in methods, when dealing with more complex formatted data, it can be desirable to define
|
||||
the ordering order yourself. Using plug-in ordering functions, you can have DataTables order data in any manner you wish.</p>
|
||||
<p>This is done by using the <a href="//datatables.net/reference/option/columns.type"><code class="option" title=
|
||||
"DataTables initialisation option">columns.type</code></a> parameter, in combination with a ordering plug-in. The ordering plug-in can be be of any level of
|
||||
"DataTables initialisation option">columns.type</code></a> parameter, in combination with a ordering plug-in. The ordering plug-in can be of any level of
|
||||
complexity (natural ordering for example can be fairly complex while also very powerful), and is defined by attaching to the
|
||||
<code>$.fn.dataTable.ext.type.order</code> object. For more information about ordering plug-ins; creating them and their requirements, please refer to the plug-in
|
||||
<code>$.fn.dataTable.ext.type.order</code> object. For more information about ordering plug-ins, creating them and their requirements, please refer to the plug-in
|
||||
development documentation.</p>
|
||||
<p>This example shows ordering with using an enumerated type.</p>
|
||||
<p>A wide variety of ready made ordering plug-ins can be found on <a href="//datatables.net/plug-ins/sorting">the DataTables plug-ins page</a>.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
@@ -70,16 +66,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Tiger Nixon</td>
|
||||
@@ -268,7 +254,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Doris Wilder</td>
|
||||
<td>Sales Assistant</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>23</td>
|
||||
<td>2010/09/20</td>
|
||||
<td>Low</td>
|
||||
@@ -324,7 +310,7 @@ $(document).ready(function() {
|
||||
<tr>
|
||||
<td>Michelle House</td>
|
||||
<td>Integration Specialist</td>
|
||||
<td>Sidney</td>
|
||||
<td>Sydney</td>
|
||||
<td>37</td>
|
||||
<td>2011/06/02</td>
|
||||
<td>Low</td>
|
||||
@@ -538,6 +524,16 @@ $(document).ready(function() {
|
||||
<td>Low</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Age</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -568,7 +564,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -641,6 +637,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -689,10 +688,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -747,6 +746,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -756,14 +758,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -920,7 +919,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -28,6 +28,7 @@ if ( window.$ ) {
|
||||
|
||||
// init html
|
||||
var table = $('<p/>').append( $('table').clone() ).html();
|
||||
|
||||
var demoHtml = $.trim( $('div.demo-html').html() );
|
||||
|
||||
if ( demoHtml ) {
|
||||
@@ -63,6 +64,15 @@ if ( window.$ ) {
|
||||
str = JSON.stringify( str, null, 2 );
|
||||
} catch ( e ) {}
|
||||
|
||||
var strArr = str.split('\n');
|
||||
|
||||
if(strArr.length > 1000){
|
||||
var first = strArr.splice(0, 500);
|
||||
var second = strArr.splice(strArr.length - 499, 499);
|
||||
first.push("\n\n... Truncated for brevity - look at your browser's network inspector to see the full source ...\n\n");
|
||||
str = first.concat(second).join('\n');
|
||||
}
|
||||
|
||||
$('div.tabs div.ajax').append(
|
||||
$('<code class="multiline language-js"/>').text( str )
|
||||
);
|
||||
@@ -94,7 +104,7 @@ if ( window.$ ) {
|
||||
}
|
||||
|
||||
if ( settings.oFeatures.bServerSide ) {
|
||||
if ( $.isFunction( settings.ajax ) ) {
|
||||
if ( typeof settings.ajax === 'function' ) {
|
||||
return;
|
||||
}
|
||||
$.ajax( {
|
||||
|
||||
@@ -1,8 +1,12 @@
|
||||
<?php
|
||||
|
||||
if ( isset( $_POST['src'] ) && preg_match( '/^scripts\/[a-zA-Z_\-_]+\.php$/', $_POST['src'] ) !== 0 ) {
|
||||
if ( isset( $_POST['src'] ) && (
|
||||
preg_match( '/^scripts\/[a-zA-Z_\-_]+\.php$/', $_POST['src'] ) !== 0 ||
|
||||
preg_match( '/^\.\.\/server_side\/scripts\/[a-zA-Z_\-_]+\.php$/', $_POST['src'] ) !== 0
|
||||
) ) {
|
||||
echo htmlspecialchars( file_get_contents( '../server_side/'.$_POST['src'] ) );
|
||||
}
|
||||
|
||||
else {
|
||||
echo '';
|
||||
}
|
||||
|
||||
@@ -87,13 +87,15 @@
|
||||
}
|
||||
.syntaxhighlighter table td.code {
|
||||
width: 100% !important;
|
||||
position: relative !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code .container {
|
||||
position: relative !important;
|
||||
overflow: auto !important;
|
||||
}
|
||||
.syntaxhighlighter table td.code .container textarea {
|
||||
box-sizing: border-box !important;
|
||||
position: absolute !important;
|
||||
position: relative !important;
|
||||
left: 0 !important;
|
||||
top: 0 !important;
|
||||
width: 100% !important;
|
||||
@@ -103,6 +105,18 @@
|
||||
padding-left: 1em !important;
|
||||
overflow: hidden !important;
|
||||
white-space: pre !important;
|
||||
line-height: 1.4em !important;
|
||||
}
|
||||
.syntaxhighlighter.source table td.code .container {
|
||||
position: absolute !important;
|
||||
overflow-x: auto !important;
|
||||
top: 0 !important;
|
||||
bottom: 0 !important;
|
||||
left: 0 !important;
|
||||
right: 0 !important;
|
||||
}
|
||||
.syntaxhighlighter.source table td.code .container div.line {
|
||||
display: none !important;
|
||||
}
|
||||
.syntaxhighlighter table td.gutter .line {
|
||||
text-align: right !important;
|
||||
@@ -390,6 +404,5 @@
|
||||
|
||||
.syntaxhighlighter table td.code {
|
||||
width: auto !important;
|
||||
overflow: auto !important;
|
||||
}
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Custom HTTP variables</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -55,7 +51,7 @@ $(document).ready(function() {
|
||||
function.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -103,7 +99,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -176,6 +172,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -224,10 +223,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -282,6 +281,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -291,14 +293,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -455,7 +454,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Deferred loading of data</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -46,10 +42,10 @@ $(document).ready(function() {
|
||||
to be displayed correctly).</p>
|
||||
<p>In the example below, the HTML page already has the first 10 rows of data available it in, so we use <a href=
|
||||
"//datatables.net/reference/option/deferLoading"><code class="option" title="DataTables initialisation option">deferLoading</code></a> to tell DataTables that this
|
||||
data is available and that it should wait for under interaction (ordering, paging etc) before making an Ajax call.</p>
|
||||
data is available and that it should wait for user interaction (ordering, paging etc) before making an Ajax call.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -60,16 +56,6 @@ $(document).ready(function() {
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
<th>Last name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
<tr class="odd">
|
||||
<td>Airi</td>
|
||||
<td>Satou</td>
|
||||
@@ -150,6 +136,16 @@ $(document).ready(function() {
|
||||
<td>29th Mar 12</td>
|
||||
<td>$433,060</td>
|
||||
</tr>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
<th>Last name</th>
|
||||
<th>Position</th>
|
||||
<th>Office</th>
|
||||
<th>Start date</th>
|
||||
<th>Salary</th>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
<ul class="tabs">
|
||||
<li class="active">Javascript</li>
|
||||
@@ -171,7 +167,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -244,6 +240,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -292,10 +291,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -350,6 +349,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -359,14 +361,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -523,7 +522,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Automatic addition of row ID attributes</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -53,7 +49,7 @@ $(document).ready(function() {
|
||||
<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>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -102,7 +98,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -175,6 +171,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -223,10 +222,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -281,6 +280,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -290,14 +292,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -454,7 +453,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,15 +3,12 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<title>DataTables examples - Server-side processing</title>
|
||||
</head>
|
||||
<body class="dt-example">
|
||||
@@ -20,13 +17,13 @@
|
||||
<h1>DataTables example <span>Server-side processing</span></h1>
|
||||
<div class="info">
|
||||
<p>There are many ways to get your data into DataTables, and if you are working with seriously large databases, you might want to consider using the server-side
|
||||
options that DataTables provides. With server-side processing enabled, all paging, searching, ordering etc actions that DataTables performs are handed off to a
|
||||
server where an SQL engine (or similar) can perform these actions on the large data set (after all, that's what the database engine is designed for!). As such,
|
||||
each draw of the table will result in a new Ajax request being made to get the required data.</p>
|
||||
options that DataTables provides. With server-side processing enabled, all actions that DataTables performs (such as paging, searching and ordering) are handed off
|
||||
to a server where an SQL engine (or similar) can perform these actions on the large data set (after all, that's what the database engine is designed for!). As
|
||||
such, each draw of the table will result in a new Ajax request to get the required data.</p>
|
||||
<p>Server-side processing is enabled by setting the <a href="//datatables.net/reference/option/serverSide"><code class="option" title=
|
||||
"DataTables initialisation option">serverSide</code></a> option to <code>true</code> and providing an Ajax data source through the <a href=
|
||||
"//datatables.net/reference/option/ajax"><code class="option" title="DataTables initialisation option">ajax</code></a> option.</p>
|
||||
<p>The examples in this section shows server-side processing in use and how it can be customised to suit your needs.</p>
|
||||
<p>The examples in this section show server-side processing in use and how it can be customised to suit your needs.</p>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
@@ -75,7 +72,7 @@
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - JSONP data source for remote domains</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -39,7 +35,7 @@ $(document).ready(function() {
|
||||
<section>
|
||||
<h1>DataTables example <span>JSONP data source for remote domains</span></h1>
|
||||
<div class="info">
|
||||
<p><a href="http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/">JSONP</a> is one of several methods to allow the use of JSON data from any server
|
||||
<p><a href="https://stackoverflow.com/questions/2067472/what-is-jsonp-all-about">JSONP</a> is one of several methods to allow the use of JSON data from any server
|
||||
(browsers have XSS protection rules which will block standard Ajax requests to remote source for security reasons). Using JSONP allows DataTables to load
|
||||
server-side sourced data from any domain and is quite simply done with the <code>dataType</code> option of the <a href=
|
||||
"//datatables.net/reference/option/ajax"><code class="option" title="DataTables initialisation option">ajax</code></a> initialisation option.</p>
|
||||
@@ -51,7 +47,7 @@ $(document).ready(function() {
|
||||
used with the <code>dataType</code> option set to retrieve JSONP data for server-side processing in DataTables.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -95,7 +91,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -168,6 +164,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -216,10 +215,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -274,6 +273,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -283,14 +285,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -447,7 +446,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Object data source</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
$(document).ready(function() {
|
||||
@@ -52,7 +48,7 @@ $(document).ready(function() {
|
||||
column.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -101,7 +97,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -174,6 +170,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -222,10 +221,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -280,6 +279,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -289,14 +291,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -453,7 +452,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - Pipelining data to reduce Ajax calls for paging</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -85,7 +81,7 @@ $.fn.dataTable.pipeline = function ( opts ) {
|
||||
request.length = requestLength*conf.pages;
|
||||
|
||||
// Provide the same `data` options as DataTables.
|
||||
if ( $.isFunction ( conf.data ) ) {
|
||||
if ( typeof conf.data === 'function' ) {
|
||||
// As a function it is executed with the data object as an arg
|
||||
// for manipulation. If an object is returned, it is used as the
|
||||
// data object to submit
|
||||
@@ -99,7 +95,7 @@ $.fn.dataTable.pipeline = function ( opts ) {
|
||||
$.extend( request, conf.data );
|
||||
}
|
||||
|
||||
settings.jqXHR = $.ajax( {
|
||||
return $.ajax( {
|
||||
"type": conf.method,
|
||||
"url": conf.url,
|
||||
"data": request,
|
||||
@@ -172,7 +168,7 @@ $(document).ready(function() {
|
||||
when using server-side processing, is only available at the server.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -266,7 +262,7 @@ $.fn.dataTable.pipeline = function ( opts ) {
|
||||
request.length = requestLength*conf.pages;
|
||||
|
||||
// Provide the same `data` options as DataTables.
|
||||
if ( $.isFunction ( conf.data ) ) {
|
||||
if ( typeof conf.data === 'function' ) {
|
||||
// As a function it is executed with the data object as an arg
|
||||
// for manipulation. If an object is returned, it is used as the
|
||||
// data object to submit
|
||||
@@ -280,7 +276,7 @@ $.fn.dataTable.pipeline = function ( opts ) {
|
||||
$.extend( request, conf.data );
|
||||
}
|
||||
|
||||
settings.jqXHR = $.ajax( {
|
||||
return $.ajax( {
|
||||
"type": conf.method,
|
||||
"url": conf.url,
|
||||
"data": request,
|
||||
@@ -336,7 +332,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -409,6 +405,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -457,10 +456,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -515,6 +514,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -524,14 +526,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -688,7 +687,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<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">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, user-scalable=no">
|
||||
<title>DataTables example - POST data</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../media/css/jquery.dataTables.css">
|
||||
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
|
||||
@@ -11,14 +11,10 @@
|
||||
<style type="text/css" class="init">
|
||||
|
||||
</style>
|
||||
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js">
|
||||
</script>
|
||||
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/syntax/shCore.js"></script>
|
||||
<script type="text/javascript" language="javascript" src="../resources/demo.js"></script>
|
||||
<script type="text/javascript" language="javascript" class="init">
|
||||
|
||||
|
||||
@@ -59,7 +55,7 @@ $(document).ready(function() {
|
||||
used with the <code>type</code> option set to <code class="string" title="String">POST</code> to make a POST request.</p>
|
||||
</div>
|
||||
<div class="demo-html"></div>
|
||||
<table id="example" class="display" cellspacing="0" width="100%">
|
||||
<table id="example" class="display" style="width:100%">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>First name</th>
|
||||
@@ -111,7 +107,7 @@ $(document).ready(function() {
|
||||
<p>In addition to the above code, the following Javascript library files are loaded for use in this example:</p>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="//code.jquery.com/jquery-1.12.4.js">//code.jquery.com/jquery-1.12.4.js</a>
|
||||
<a href="https://code.jquery.com/jquery-3.5.1.js">https://code.jquery.com/jquery-3.5.1.js</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../../media/js/jquery.dataTables.js">../../media/js/jquery.dataTables.js</a>
|
||||
@@ -184,6 +180,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../basic_init/state_save.html">State saving</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/data_rendering.html">Data rendering</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../basic_init/alt_pagination.html">Alternative pagination</a>
|
||||
</li>
|
||||
@@ -232,10 +231,10 @@ $(document).ready(function() {
|
||||
<a href="../advanced_init/object_dom_read.html">Read HTML to data objects</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/html5-data-attributes.html">HTML5 data-* attributes - cell data</a>
|
||||
<a href="../advanced_init/html5-data-options.html">HTML5 data-* attributes - table options</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../advanced_init/language_file.html">Language file</a>
|
||||
@@ -290,6 +289,9 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/bootstrap.html">Bootstrap 3</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/foundation.html">Foundation</a>
|
||||
</li>
|
||||
@@ -299,14 +301,11 @@ $(document).ready(function() {
|
||||
<li>
|
||||
<a href="../styling/jqueryUI.html">jQuery UI ThemeRoller</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/bootstrap4.html">Bootstrap 4 (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/material.html">Material Design (Tech. preview)</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="../styling/uikit.html">UIKit (Tech. preview)</a>
|
||||
<a href="../styling/uikit.html">UIKit 3 (Tech. preview)</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -463,7 +462,7 @@ $(document).ready(function() {
|
||||
<p>Please refer to the <a href="http://www.datatables.net">DataTables documentation</a> for full information about its API properties and methods.<br>
|
||||
Additionally, there are a wide range of <a href="http://www.datatables.net/extensions">extensions</a> and <a href=
|
||||
"http://www.datatables.net/plug-ins">plug-ins</a> which extend the capabilities of DataTables.</p>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2017<br>
|
||||
<p class="copyright">DataTables designed and created by <a href="http://www.sprymedia.co.uk">SpryMedia Ltd</a> © 2007-2020<br>
|
||||
DataTables is licensed under the <a href="http://www.datatables.net/mit">MIT license</a>.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user