disable filter widget per column

This commit is contained in:
Rob Garrison 2011-09-16 13:39:03 -05:00
parent 0325d3b509
commit f4701e28c8
8 changed files with 66 additions and 24 deletions

View File

@ -28,6 +28,14 @@ Included all original [document pages](http://mottie.github.com/tablesorter/docs
View the [complete listing here](http://mottie.github.com/tablesorter/changelog.txt). View the [complete listing here](http://mottie.github.com/tablesorter/changelog.txt).
#### Version 2.0.20 (2011-09-16)
* Filter Widget
* Added "filter" to the "headers" option to allow disabling the filter option for a specific column - thanks jizo!
* Added "filter-false" class, that when applied will disable the filter widget for that column.
* Updated the headers docs and the filter widget demo.
* Updated the currency parser to use unicode characters to better work in different document formats.
#### Version 2.0.19 (2011-09-16) #### Version 2.0.19 (2011-09-16)
* Added code in attempt to clear the table headers between multiple tables - fix for [issue #2](https://github.com/Mottie/tablesorter/issues/2). * Added code in attempt to clear the table headers between multiple tables - fix for [issue #2](https://github.com/Mottie/tablesorter/issues/2).

View File

@ -1,5 +1,14 @@
TableSorter Change Log TableSorter Change Log
Version 2.0.20 (2011-09-16)
============================
* Filter Widget
* Added "filter" to the "headers" option to allow disabling the filter option for a specific column - thanks jizo!
* Added "filter-false" class, that when applied will disable the filter widget for that column.
* Updated the headers docs and the filter widget demo.
* Updated the currency parser to use unicode characters to better work in different document formats.
Version 2.0.19 (2011-09-16) Version 2.0.19 (2011-09-16)
============================ ============================

View File

@ -26,7 +26,8 @@
// call the tablesorter plugin // call the tablesorter plugin
$("table").tablesorter({ $("table").tablesorter({
// initialize zebra striping and filter widgets // initialize zebra striping and filter widgets
widgets: ["zebra", "filter"] widgets: ["zebra", "filter"],
headers: { 5: { sorter: false, filter: false } }
}); });
});</script> });</script>
@ -41,7 +42,12 @@
<div id="main"> <div id="main">
<p class="tip"> <p class="tip">
<em>NOTE!</em> This widget can be applied to the original plugin. <em>NOTE!</em>
<ul>
<li>This widget can be applied to the original plugin. The code is in the "jquery.tablesorter.widgets.js" file.</li>
<li>Added filter header option and class name to allow disabling the filter in a specific column in v2.0.19.1.</li>
<li>The Discount column has the "filter-false" class added to the header - see the HTML on how to add this ability.</li>
<li>The Date column has the "headers" option applied to disable the sort and the filter - see the table options in the javascript for this example.</li>
</p> </p>
<h1>Demo</h1> <h1>Demo</h1>
@ -52,7 +58,7 @@
<th>Last Name</th> <th>Last Name</th>
<th>Age</th> <th>Age</th>
<th>Total</th> <th>Total</th>
<th>Discount</th> <th class="filter-false">Discount</th> <!-- disable filter in this column -->
<th>Date</th> <th>Date</th>
</tr> </tr>
</thead> </thead>
@ -126,7 +132,7 @@
<h1>Page Header</h1> <h1>Page Header</h1>
<div> <div>
<pre class="html">&lt;!-- blue theme stylesheet with additional css styles added in v2.0.17 --&gt; <pre class="html">&lt;!-- blue theme stylesheet --&gt;
&lt;link rel=&quot;stylesheet&quot; href=&quot;../css/blue/style.css&quot;&gt; &lt;link rel=&quot;stylesheet&quot; href=&quot;../css/blue/style.css&quot;&gt;
&lt;!-- tablesorter plugin --&gt; &lt;!-- tablesorter plugin --&gt;
&lt;script src=&quot;../js/jquery.tablesorter.js&quot;&gt;&lt;/script&gt; &lt;script src=&quot;../js/jquery.tablesorter.js&quot;&gt;&lt;/script&gt;
@ -140,6 +146,18 @@
<pre class="js"></pre> <pre class="js"></pre>
</div> </div>
<h1>CSS</h1>
<div>
<pre class="css">/* filter widget, added to style.css themes */
table.tablesorter thead input.filter {
width: 90%;
}
table.tablesorter thead tr.filters, table.tablesorter thead tr.filters td {
text-align: center;
background: #fff;
}</pre>
</div>
<h1>HTML</h1> <h1>HTML</h1>
<div id="html"> <div id="html">
<pre class="html"></pre> <pre class="html"></pre>

View File

@ -36,7 +36,7 @@
</div> </div>
<p> <p>
<strong>Author:</strong> <a class="external" href="http://lovepeacenukes.com">Christian Bach</a><br> <strong>Author:</strong> <a class="external" href="http://lovepeacenukes.com">Christian Bach</a><br>
<strong>Version:</strong> 2.0.17 (forked from <a href="http://tablesorter.com/docs/">version 2.0.5</a>, <a href="../changelog.txt">changelog</a>)<br> <strong>Version:</strong> 2.0.20 (forked from <a href="http://tablesorter.com/docs/">version 2.0.5</a>, <a href="../changelog.txt">changelog</a>)<br>
<strong>Licence:</strong> <strong>Licence:</strong>
Dual licensed under <a class="external" href="http://www.opensource.org/licenses/mit-license.php">MIT</a> Dual licensed under <a class="external" href="http://www.opensource.org/licenses/mit-license.php">MIT</a>
or <a class="external" href="http://www.opensource.org/licenses/gpl-license.php">GPL</a> licenses. or <a class="external" href="http://www.opensource.org/licenses/gpl-license.php">GPL</a> licenses.
@ -524,13 +524,17 @@
3: { sorter: "digit", string: "max-" }, // maximum negative value 3: { sorter: "digit", string: "max-" }, // maximum negative value
// Sort the fifth column by date (e.g. mm/dd/yyyy if the date format is "us") // Sort the fifth column by date (e.g. mm/dd/yyyy if the date format is "us")
4: { sorter: "shortDate" } 4: { sorter: "shortDate" },
// See example 3: lock the sort order - this option will not work if added as metadata // See example 3: lock the sort order - this option will not work if added as metadata
5: { lockedOrder: "asc" }, 5: { lockedOrder: "asc" },
// See Example 4: Initial sort order direction of seventh column // See Example 4: Initial sort order direction of seventh column
6: { sortInitialOrder: "desc" } 6: { sortInitialOrder: "desc" },
// Set the filter to false to disable the filter widget in this column
// See the "Applying the filter widget" demo
7: { filter: false }
} }
}); });

View File

@ -32,22 +32,22 @@
<thead> <thead>
<tr> <tr>
<th>AlphaNumeric Sort *New*</th> <th>AlphaNumeric Sort *New*</th>
<th>Numeric</th> <th>Currency</th>
<th>Alphabetical</th> <th>Alphabetical</th>
<th>Sites</th> <th>Sites</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr><td>abc 123</td><td>10</td><td>Koala</td><td>http://www.google.com</td></tr> <tr><td>abc 123</td><td>&#163;10,40</td><td>Koala</td><td>http://www.google.com</td></tr>
<tr><td>abc 1</td><td>234</td><td>Ox</td><td>http://www.yahoo.com</td></tr> <tr><td>abc 1</td><td>&#163;234,10</td><td>Ox</td><td>http://www.yahoo.com</td></tr>
<tr><td>abc 9</td><td>10</td><td>Girafee</td><td>http://www.facebook.com</td></tr> <tr><td>abc 9</td><td>&#163;10,33</td><td>Girafee</td><td>http://www.facebook.com</td></tr>
<tr><td>zyx 24</td><td>767</td><td>Bison</td><td>http://www.whitehouse.gov/</td></tr> <tr><td>zyx 24</td><td>&#163;10</td><td>Bison</td><td>http://www.whitehouse.gov/</td></tr>
<tr><td>abc 11</td><td>3</td><td>Chimp</td><td>http://www.ucla.edu/</td></tr> <tr><td>abc 11</td><td>&#163;3,20</td><td>Chimp</td><td>http://www.ucla.edu/</td></tr>
<tr><td>abc 2</td><td>56</td><td>Elephant</td><td>http://www.wikipedia.org/</td></tr> <tr><td>abc 2</td><td>&#163;56,10</td><td>Elephant</td><td>http://www.wikipedia.org/</td></tr>
<tr><td>abc 9</td><td>155</td><td>Lion</td><td>http://www.nytimes.com/</td></tr> <tr><td>abc 9</td><td>&#163;3,20</td><td>Lion</td><td>http://www.nytimes.com/</td></tr>
<tr><td>ABC 10</td><td>87</td><td>Zebra</td><td>http://www.google.com</td></tr> <tr><td>ABC 10</td><td>&#163;87,00</td><td>Zebra</td><td>http://www.google.com</td></tr>
<tr><td>zyx 1</td><td>999</td><td>Koala</td><td>http://www.mit.edu/</td></tr> <tr><td>zyx 1</td><td>&#163;99,90</td><td>Koala</td><td>http://www.mit.edu/</td></tr>
<tr><td>zyx 12</td><td>0</td><td>Llama</td><td>http://www.nasa.gov/</td></tr> <tr><td>zyx 12</td><td>&#163;234,10</td><td>Llama</td><td>http://www.nasa.gov/</td></tr>
</tbody> </tbody>
</table> </table>

View File

@ -1,6 +1,6 @@
/* /*
* TableSorter 2.0 - Client-side table sorting with ease! * TableSorter 2.0 - Client-side table sorting with ease!
* Version 2.0.19 * Version 2.0.20
* @requires jQuery v1.2.3 * @requires jQuery v1.2.3
* *
* Copyright (c) 2007 Christian Bach * Copyright (c) 2007 Christian Bach
@ -840,10 +840,10 @@
ts.addParser({ ts.addParser({
id: "currency", id: "currency",
is: function(s){ is: function(s){
return (/^[£$€¤¥¢?.]/).test(s); return (/^[\u00a3$\u20ac\u00a4\u00a5\u00a2?.]/).test(s); // £$€¤¥¢?.
}, },
format: function(s){ format: function(s){
return $.tablesorter.formatFloat(s.replace(new RegExp(/[^0-9.\-]/g), "")); return $.tablesorter.formatFloat(s.replace(new RegExp(/[^0-9., \-]/g), ""));
}, },
type: "numeric" type: "numeric"
}); });

File diff suppressed because one or more lines are too long

View File

@ -96,7 +96,10 @@ $.tablesorter.addWidget({
time = new Date(); time = new Date();
} }
for (i=0; i < cols; i++){ for (i=0; i < cols; i++){
fr += '<td><input type="text" class="filter" data-col="' + i + '"></td>'; fr += '<td><input type="text" class="filter" data-col="' + i + '" style="';
// use header option - headers: { 1: { filter: false } } OR add class="filter-false"
fr += ((c.headers[i] && 'filter' in c.headers[i] && c.headers[i].filter === false) || $(c.headerList[i]).is('.filter-false') ) ? 'visibility:hidden' : '';
fr += '"></td>';
} }
tbl tbl
.find('thead').append(fr += '</tr>') .find('thead').append(fr += '</tr>')