Permalink
Browse files

filter widget

  • Loading branch information...
1 parent db0863f commit f430c9d113d531d6b47390ac7d05608c45152dfe @Mottie committed Sep 13, 2011
View
@@ -28,6 +28,13 @@ Included all original [document pages](http://mottie.github.com/tablesorter/docs
View the [complete listing here](http://mottie.github.com/tablesorter/changelog.txt).
+#### Version 2.0.18 (2011-09-13)
+
+* Fixed a bug in the column widget, it would cause an error if no initial sort was set.
+* Fixed a bug where an error would occur if a widget doesn't exist.
+* Updated pager widget to allow restoring the pager plugin & updated demo.
+* Added column filter widget. It is designed so that each column has an filter.
+
#### Version 2.0.17 (2011-09-11)
* Added a jquery.tablesorter.widget.js file:
@@ -43,6 +43,7 @@
out.html(s);
}
pagerArrows(c);
+ c.container.show(); // added in case the pager is reinitialized after being destroyed.
$(table).trigger('pagerComplete', c);
},
View
@@ -1,5 +1,13 @@
TableSorter Change Log
+Version 2.0.18 (2011-09-13)
+============================
+
+* Fixed a bug in the column widget, it would cause an error if no initial sort was set.
+* Fixed a bug where an error would occur if a widget doesn't exist.
+* Updated pager widget to allow restoring the pager plugin & updated demo.
+* Added column filter widget. It is designed so that each column has an filter.
+
Version 2.0.17 (2011-09-11)
============================
View
Binary file not shown.
View
@@ -65,3 +65,12 @@ table.tablesorter tbody td.tertiary, table.tablesorter tbody tr.odd td.tertiary
table.tablesorter tbody tr.even td.tertiary {
background-color: #f8f8ff;
}
+
+/* filter widget */
+table.tablesorter thead input.filter {
+ width: 90%;
+}
+table.tablesorter thead tr.filters, table.tablesorter thead tr.filters td {
+ text-align: center;
+ background: #fff;
+}
View
Binary file not shown.
View
@@ -67,3 +67,11 @@ table.tablesorter tbody tr.even td.tertiary {
background-color: #f8fff8;
}
+/* filter widget */
+table.tablesorter thead input.filter {
+ width: 90%;
+}
+table.tablesorter thead tr.filters, table.tablesorter thead tr.filters td {
+ text-align: center;
+ background: #fff;
+}
View
@@ -23,4 +23,12 @@ table.tablesorter tbody td {
table.tablesorter .header .ui-theme {
display: block;
float: right;
+}
+
+/* filter widget */
+table.tablesorter thead input.filter {
+ width: 90%;
+}
+table.tablesorter thead tr.filters, table.tablesorter thead tr.filters td {
+ text-align: center;
}
View
@@ -34,23 +34,25 @@
<script id="js">$(function(){
+ var pagerOptions = {
+ // target the pager markup
+ container: $("#pager"),
+ // output default: '{page}/{totalPages}'
+ output: '{startRow} to {endRow} ({totalRows})',
+ // apply disabled classname to the pager arrows when the rows at either extreme is visible
+ updateArrows: true,
+ // do not absolutely position the pager
+ positionFixed: false
+ };
+
$("table")
.tablesorter({
widthFixed: true,
widgets: ['zebra']
})
// initialize the pager plugin
- .tablesorterPager({
- // target the pager markup
- container: $("#pager"),
- // output default: '{page}/{totalPages}'
- output: '{startRow} to {endRow} ({totalRows})',
- // apply disabled classname to the pager arrows when the rows at either extreme is visible
- updateArrows: true,
- // do not absolutely position the pager
- positionFixed: false
- })
+ .tablesorterPager(pagerOptions)
// bind to pager events
.bind('pagerChange pagerComplete', function(e,c){
@@ -77,6 +79,23 @@
// Destroy pager
$('button:contains(Destroy)').click(function(){
$('table').trigger('destroy.pager');
+
+ // fancy disable/enable buttons - not really needed
+ $('button:contains(Restore)').removeAttr('disabled');
+ $(this).attr('disabled', true);
+
+ });
+
+ // Restore pager
+ $('button:contains(Restore)').click(function(){
+
+ // restore the pager
+ $('table').tablesorterPager(pagerOptions);
+
+ // fancy disable/enable buttons - not really needed
+ $(this).attr('disabled', true);
+ $('button:contains(Destroy)').removeAttr('disabled');
+
});
});</script>
@@ -112,7 +131,7 @@
<h1>Demo</h1>
<br>
- <button>Add Rows</button> <button>Destroy Pager</button>
+ <button>Add Rows</button> <button>Destroy Pager</button> <button disabled>Restore Pager</button>
<br><br>
<div id="pager" class="pager">
<form>
@@ -127,7 +127,7 @@
<div class="next-up">
<hr />
- Next up: <a href="example-widget-ui-theme.html">Basic: Applying a jQuery UI theme widget &rsaquo;&rsaquo;</a>
+ Next up: <a href="example-widget-filter.html">Basic: Applying the filter widget &rsaquo;&rsaquo;</a>
</div>
</div>
@@ -0,0 +1,157 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8">
+ <title>jQuery plugin: Tablesorter 2.0 - Filter Widget</title>
+
+ <!-- jQuery -->
+ <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></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>
+
+ <!-- Tablesorter: optional -->
+ <!-- <script src="../addons/pager/jquery.tablesorter.pager.js"></script> -->
+
+<script id="js">$(function() {
+
+ // call the tablesorter plugin
+ $("table").tablesorter({
+ // initialize zebra striping and filter widgets
+ widgets: ["zebra", "filter"]
+ });
+
+});</script>
+</head>
+<body>
+<div id="banner">
+ <h1>table<em>sorter</em></h1>
+ <h2>Filter Widget</h2>
+ <h3>Flexible client-side table sorting</h3>
+ <a href="index.html">Back to documentation</a>
+</div>
+<div id="main">
+
+ <p class="tip">
+ <em>NOTE!</em> This widget can be applied to the original plugin.
+ </p>
+
+ <h1>Demo</h1>
+ <div id="demo"><table class="tablesorter">
+ <thead>
+ <tr>
+ <th>First Name</th>
+ <th>Last Name</th>
+ <th>Age</th>
+ <th>Total</th>
+ <th>Discount</th>
+ <th>Date</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>Philip</td>
+ <td>Johnson</td>
+ <td>25</td>
+ <td>$5.95</td>
+ <td>22%</td>
+ <td>Jun 26, 2004 7:22 AM</td>
+ </tr>
+ <tr>
+ <td>Aaron</td>
+ <td>Hibert</td>
+ <td>12</td>
+ <td>$2.99</td>
+ <td>5%</td>
+ <td>Aug 21, 2009 12:21 PM</td>
+ </tr>
+ <tr>
+ <td>Brandon</td>
+ <td>Henry</td>
+ <td>51</td>
+ <td>$42.29</td>
+ <td>18%</td>
+ <td>Oct 13, 2000 1:15 PM</td>
+ </tr>
+ <tr>
+ <td>Peter</td>
+ <td>Parker</td>
+ <td>28</td>
+ <td>$9.99</td>
+ <td>20%</td>
+ <td>Jul 6, 2006 8:14 AM</td>
+ </tr>
+ <tr>
+ <td>John</td>
+ <td>Hood</td>
+ <td>33</td>
+ <td>$19.99</td>
+ <td>25%</td>
+ <td>Dec 10, 2002 5:14 AM</td>
+ </tr>
+ <tr>
+ <td>Clark</td>
+ <td>Kent</td>
+ <td>18</td>
+ <td>$15.89</td>
+ <td>44%</td>
+ <td>Jan 12, 2003 11:14 AM</td>
+ </tr>
+ <tr>
+ <td>Bruce</td>
+ <td>Almighty</td>
+ <td>45</td>
+ <td>$153.19</td>
+ <td>44%</td>
+ <td>Jan 18, 2001 9:12 AM</td>
+ </tr>
+ <tr>
+ <td>Bruce</td>
+ <td>Evans</td>
+ <td>22</td>
+ <td>$13.19</td>
+ <td>11%</td>
+ <td>Jan 18, 2007 9:12 AM</td>
+ </tr>
+ </tbody>
+</table></div>
+
+ <h1>Page Header</h1>
+ <div>
+ <pre class="html">&lt;!-- blue theme stylesheet with additional css styles added in v2.0.17 --&gt;
+&lt;link rel=&quot;stylesheet&quot; href=&quot;../css/blue/style.css&quot;&gt;
+&lt;!-- tablesorter plugin --&gt;
+&lt;script src=&quot;../js/jquery.tablesorter.js&quot;&gt;&lt;/script&gt;
+
+&lt;!-- tablesorter widget file - loaded after the plugin --&gt;
+&lt;script src=&quot;../js/jquery.tablesorter.widgets.js&quot;&gt;&lt;/script&gt;</pre>
+ </div>
+
+ <h1>Javascript</h1>
+ <div id="javascript">
+ <pre class="js"></pre>
+ </div>
+
+ <h1>HTML</h1>
+ <div id="html">
+ <pre class="html"></pre>
+ </div>
+
+<div class="next-up">
+ <hr />
+ Next up: <a href="example-widget-ui-theme.html">Basic: Applying a jQuery UI theme widget &rsaquo;&rsaquo;</a>
+</div>
+
+</div>
+
+</body>
+</html>
+
View
@@ -300,6 +300,7 @@
<li><a href="example-apply-widget.html">Applying widgets</a></li>
<li><a href="example-widget-zebra.html">Applying the zebra stripe widget</a></li>
<li><a href="example-widget-columns.html">Applying the columns widget</a> <span class="tip"><em>New! v2.0.17</em></span></li>
+ <li><a href="example-widget-filter.html">Applying the filter widget</a> <span class="tip"><em>New! v2.0.18</em></span></li>
<li><a href="example-widget-ui-theme.html">Applying the jQuery UI theme widget</a> <span class="tip"><em>New! v2.0.9</em></span></li>
<li><a href="example-parsers-class-name.html">Disable or set the column parser using class names</a> <span class="tip"><em>New! v2.0.11</em></span></li>
<li><a href="example-options-headers.html">Disable sort using headers options</a></li>
View
@@ -1,6 +1,6 @@
/*
* TableSorter 2.0 - Client-side table sorting with ease!
-* Version 2.0.17
+* Version 2.0.18
* @requires jQuery v1.2.3
*
* Copyright (c) 2007 Christian Bach
@@ -262,23 +262,28 @@
if (table.config.debug) {
benchmark("Building cache for " + totalRows + " rows:", cacheTime);
}
+ table.config.cache = cache;
return cache;
}
function getWidgetById(name) {
- var i, l = widgets.length;
+ var i, w, l = widgets.length;
for (i = 0; i < l; i++) {
- if (widgets[i].id.toLowerCase() === name.toLowerCase()) {
- return widgets[i];
+ w = widgets[i];
+ if (w && w.hasOwnProperty('id') && w.id.toLowerCase() === name.toLowerCase()) {
+ return w;
}
}
}
function applyWidget(table) {
var c = table.config.widgets,
- i, l = c.length;
+ i, w, l = c.length;
for (i = 0; i < l; i++) {
- getWidgetById(c[i]).format(table);
+ w = getWidgetById(c[i]);
+ if ( w && w.hasOwnProperty('format') ) {
+ w.format(table);
+ }
}
}
@@ -710,6 +715,7 @@
pos = [(cell.parentNode.rowIndex - 1), cell.cellIndex];
// update cache
cache.normalized[pos[0]][pos[1]] = config.parsers[pos[1]].format(getElementText(config, cell, pos[1]), cell);
+ this.config.cache = cache;
$this.trigger("sorton", [config.sortList]);
})
.bind("addRows", function(e, row) {
@@ -728,6 +734,7 @@
cache.normalized.push(dat);
dat = [];
}
+ config.cache = cache;
// resort using current settings
$this.trigger("sorton", [config.sortList]);
})

Large diffs are not rendered by default.

Oops, something went wrong.
Oops, something went wrong.

0 comments on commit f430c9d

Please sign in to comment.