Skip to content
Fetching contributors…
Cannot retrieve contributors at this time
185 lines (168 sloc) 4.07 KB
<!DOCTYPE html>
<meta charset="utf-8">
<title>jQuery plugin: Tablesorter 2.0 - Save Sort Widget</title>
<!-- jQuery -->
<script src=""></script>
<!-- Demo stuff -->
<link rel="stylesheet" href="css/jq.css">
<script src="js/chili/jquery.chili-2.2.js"></script>
<script src="js/chili/recipes.js"></script>
<script src="js/docs.js"></script>
<!-- Tablesorter: required -->
<link rel="stylesheet" href="../css/blue/style.css">
<script src="../js/jquery.tablesorter.js"></script>
<script src="../js/jquery.tablesorter.widgets.js"></script>
<script id="js">$(function() {
// call the tablesorter plugin
// use save sort widget
widgets: ["saveSort", "zebra"]
<div id="banner">
<h2>Save Sort Widget</h2>
<h3>Flexible client-side table sorting</h3>
<a href="index.html">Back to documentation</a>
<div id="main">
<p class="tip">
<li>This widget can be applied to the original plugin. The code is in the "jquery.tablesorter.widgets.js" file.</li>
<li>Sort one or more columns, then reload the page to see that this widget remembers the last table sort.</li>
<li>Sort saving requires the new "$" function included with the "jquery.tablesorter.widgets.js" file. <span class="tip"><em>New! v2.1</em></span></li>
<li>Because this widget uses jQuery's <code class="hilight">parseJson()</code> function, it requires jQuery version 1.4.1+.</li>
<div id="demo"><table class="tablesorter">
<th>Account #</th>
<th>First Name</th>
<th>Last Name</th>
<!-- IMDB top 5 movies (3/2012) -->
<td><a href="">The Shawshank Redemption</a> (1994)</td>
<td><a href="">The Godfather</a> (1972)</td>
<td><a href="">The Godfather: Part II</a> (1974)</td>
<td><a href="">Pulp Fiction</a> (1994)</td>
<td><a href="">The Good, the Bad and the Ugly</a> (1966)</td>
<h1>Page Header</h1>
<pre class="html">
&lt;link rel="stylesheet" href="css/blue/style.css"&gt;
&lt;script src=""&gt;&lt;/script&gt;
&lt;script src="js/jquery.tablesorter.min.js"&gt;&lt;/script&gt;
&lt;script src="js/jquery.tablesorter.widgets.min.js">&lt;/script&gt;</pre>
<div id="javascript">
<pre class="js"></pre>
<div id="html">
<pre class="html"></pre>
<div class="next-up">
<hr />
Next up: <a href="example-widget-sticky-header.html">Applying the sticky header widget &rsaquo;&rsaquo;</a>
Jump to Line
Something went wrong with that request. Please try again.