mirror of
https://github.com/Mottie/tablesorter.git
synced 2024-11-15 23:54:22 +00:00
Docs: clarify difference between jQuery data & data-attributes
This commit is contained in:
parent
17c30f1710
commit
8ff560e00f
@ -2,7 +2,7 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery plugin: Tablesorter 2.0 - Disable or set the column parser using jQuery data</title>
|
||||
<title>jQuery plugin: Tablesorter 2.0 - Disable or set the column parser using data</title>
|
||||
|
||||
<!-- jQuery -->
|
||||
<script src="js/jquery-latest.min.js"></script>
|
||||
@ -18,13 +18,19 @@
|
||||
<script src="../js/jquery.tablesorter.js"></script>
|
||||
|
||||
<script id="js">$(function(){
|
||||
$("table").tablesorter({ theme: 'blue' });
|
||||
// set Discount column parser using jQuery data (either 'digit' or 'percent' will work)
|
||||
$('th.discount').data('sorter', 'digit');
|
||||
// set an initial sort on the table using jQuery data
|
||||
$('table').data('sortlist', [[4,0]]);
|
||||
|
||||
// the rest of the parsers are set using the header cell data-attribute
|
||||
$('table').tablesorter({ theme: 'blue' });
|
||||
});</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="banner">
|
||||
<h1>table<em>sorter</em></h1>
|
||||
<h2>Disable or set the column parser using jQuery data</h2>
|
||||
<h2>Disable or set the column parser using data</h2>
|
||||
<h3>Flexible client-side table sorting</h3>
|
||||
<a href="index.html">Back to documentation</a>
|
||||
</div>
|
||||
@ -42,7 +48,7 @@
|
||||
<th data-sorter="text">Last Name</th>
|
||||
<th data-sorter="false">Age</th>
|
||||
<th data-sorter="currency" data-string="min">Total</th> <!-- data-string="min" treats strings in this numeric column as a large negative number -->
|
||||
<th data-sorter="percent" data-empty="top">Discount</th> <!-- data-empty="top" sorts empty cells to the top -->
|
||||
<th class="discount" data-empty="top">Discount</th> <!-- data-empty="top" sorts empty cells to the top -->
|
||||
<th data-sorter="usLongDate">Date</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
@ -380,7 +380,7 @@
|
||||
<li><a href="example-option-digits.html">Dealing with digits!</a></li>
|
||||
<li><a href="example-options-headers-digits-strings.html">Dealing with text strings in numerical sorts</a> (<a href="#stringto"><code>stringTo</code></a>; v2.0.10)</li>
|
||||
<li><a href="example-parsers-class-name.html">Disable or set the column parser using class names</a> (v2.0.11)</li>
|
||||
<li><a href="example-parsers-jquery-data.html">Disable or set the column parser using jQuery Data</a> (v2.3)</li>
|
||||
<li><a href="example-parsers-jquery-data.html">Disable or set the column parser using data</a> (v2.3)</li>
|
||||
<li><a href="example-extractors-parsers.html">Using extractors with parsers</a> (<span class="version">v2.17.6</span>)</li>
|
||||
<li><a href="example-option-date-format.html">Changing the date format</a> (v2.0.23)</li>
|
||||
</ul>
|
||||
@ -1290,7 +1290,7 @@ From the example function above, you'll end up with something similar to this HT
|
||||
sortList : [[1,0], [2,0]] // initial sort columns (2nd and 3rd)
|
||||
});
|
||||
});</pre>
|
||||
This option can also be set using jQuery data (v2.3.1) or metadata on the table:
|
||||
This option can also be set using data-attributes (v2.3.1), jQuery data or metadata on the table:
|
||||
<table class="info">
|
||||
<tfoot>
|
||||
<tr><td colspan="2"><strong>** Note</strong>: <code>data-sortlist</code> data is not supported in jQuery versions older than 1.4.</td></tr>
|
||||
|
Loading…
Reference in New Issue
Block a user