update docs, more unit testing & minor tweaks

This commit is contained in:
Mottie 2013-05-08 23:36:06 -05:00
parent 5428e35098
commit 6e5351d104
34 changed files with 914 additions and 445 deletions

261
README.md
View File

@ -43,6 +43,156 @@ tablesorter can successfully parse and sort many types of data including linked
View the [complete listing here](https://github.com/Mottie/tablesorter/wiki/Change).
#### <a name="v2.10">Version 2.10</a> (5/8/2013)
* Core changes:
* Fixed/updated content selection &amp; form interaction in both headers and sticky headers.
* Added missing `sortBegin` event when the `sorton` method is used. YAY for unit testing!
* Fixed digit and currency parsers not returning appropriately formatted text, when encountered. Another point for unit testing! :P
* Added a public function `$.tablesorter.addHeaderResizeEvent`
* This function exists within the `jquery.tablesorter.widgets.js` file.
* There is no built-in resize event for non-window elements, so when this function is active it triggers a `resize` event when the header cell changes size.
* Enable the triggering of header cell resize events as follows:
```js
var table = $('table')[0],
disable = false,
options = {
timer : 250 // header cell size is checked every 250 milliseconds (1/4 of a second)
};
$.tablesorter.addHeaderResizeEvent( table, disable, options );
```
* To disable resize event triggering:
```js
var table = $('table')[0];
$.tablesorter.addHeaderResizeEvent( table, true );
```
* Filter widget updates:
* Triggered filter searches now properly update the filter column inputs. See [issue #146](https://github.com/Mottie/tablesorter/issues/146).
* Added disabled filter styling to the Bootstrap theme. Thanks to [riker09](https://github.com/riker09) ([issue #283](https://github.com/Mottie/tablesorter/pull/283)).
* Fixed `filter_liveSearch` option to properly work in non-webkit browsers. See [issue #285](https://github.com/Mottie/tablesorter/issues/285).
* Modified `filter_liveSearch` to allow adding a numeric value to the option, this sets a character threshold which triggers the search when met. Fulfills [issue #286](https://github.com/Mottie/tablesorter/issues/286).
* Fixed select dropdowns within the sticky header now work properly. Fixes [issue #288](https://github.com/Mottie/tablesorter/issues/288).
* Added a method to allow properly parsed dates to be comparible using `<`, `<=`, `>`, `>=` and date ranges. Fulfills [issue #302](https://github.com/Mottie/tablesorter/issues/302).
* Added `filter_filteredRow` option which contains the class name added to each visible filtered row. Used by the pager to properly count filtered rows.
* Fixed a problem with `filter_searchDelay` which was broken in v2.9.0. Opps, sorry!
* Minor tweaks to the filter formatter file to allow elements in multiple tables (removed some IDs). More fixing needed!
* Sticky Headers widget:
* Fixed/updated content selection &amp; form interaction in both headers and sticky headers. Fixes [issue #57](https://github.com/Mottie/tablesorter/issues/57).
* Fixed an issue with content resizing the table, but not the sticky header.
* Added `stickyHeaders_addResizeEvent` option to enable this updating.
* This option uses the new `$.tablesorter.addHeaderResizeEvent` function.
* Fixes [issue #289](https://github.com/Mottie/tablesorter/issues/289).
* Added `stickyHeaders_offset` option
* This option sets the point where the sticky header locks while scrolling. Allowing space for sticky navigation bars, etc.
* This option accepts:
* pixel value: `stickyHeaders_offset: 20`
* jQuery selector: `stickyHeaders_offset: '.navbar-fixed-top`
* jQuery object: `stickyHeaders_offset: $('.navbar-fixed-top')`
* Fullfills feature request [#294](https://github.com/Mottie/tablesorter/issues/294).
* Pager addon updates:
* Controls are now cached internally.
* `table.config.pager.$container` now stores the jQuery object targeted by the pager `container` option.
* `table.config.pager.$goto` stores the jQuery object targeted by `cssGoto`.
* `table.config.pager.$size` stores the jQuery object targeted by `cssPageSize`.
* Page size selectors should now update properly when the `pageSet` or `pageSize` methods are used.
* The pager should now properly target the *first sortable* tbody (it will skip any "info-only" tbodies).
* Fixed `pagerComplete` callback firing more than once while sorting or filtering. Fixes [issue #291](https://github.com/Mottie/tablesorter/issues/291).
* Fixed pager not updating when the filter widget reveals zero matches. Fixes [issue #297](https://github.com/Mottie/tablesorter/issues/297).
* The pager ajax function now does better error handling.
* Updated the pager ajax error displayed row; including updating all themes.
* Added `ajaxObject` option:
* You can now customize how the pager plugin interacts performs its ajax functioning.
* Modify the `ajaxObject` to include any of the [ajax settings](http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings):
```js
ajaxObject: {
dataType: 'json'
}
```
* The only option that gets overwritten is the `url` option. It is set by the `ajaxUrl` and `customAjaxUrl` options.
* Fulfills [issue #280](https://github.com/Mottie/tablesorter/pull/280).
* Updated `ajaxProcessing` to now make returning rows optional, or it can now accept the rows as a jQuery object instead of an array. The addon triggers an "update" event internally, so no need to include that.
* Return a jQuery object
```js
ajaxProcessing: function(data, table){
if (data && data.hasOwnProperty('rows')) {
var r, row, c, d = data.rows,
// total number of rows (required)
total = data.total_rows,
// array of header names (optional)
headers = data.headers,
// all rows: array of arrays; each internal array has the table cell data for that row
rows = '',
// len should match pager set size (c.size)
len = d.length;
// this will depend on how the json is set up - see City0.json
// rows
for ( r=0; r < len; r++ ) {
rows += '<tr class="ajax-row">'; // new row array
// cells
for ( c in d[r] ) {
if (typeof(c) === "string") {
rows += '<td>' + d[r][c] + '</td>'; // add each table cell data to row array
}
}
rows += '</tr>'; // add new row array to rows array
}
// don't attach the $(rows) because it's difficult to tell old from new data
// and no need to trigger an update method, it's done internally
return [ total, $(rows), headers ];
}
},
```
* Build the table yourself (just return the total number of rows):
```js
ajaxProcessing: function(data, table){
if (data && data.hasOwnProperty('rows')) {
var r, row, c, d = data.rows,
// total number of rows (required)
total = data.total_rows,
// all rows: array of arrays; each internal array has the table cell data for that row
rows = '',
// len should match pager set size (c.size)
len = d.length;
// this will depend on how the json is set up - see City0.json
// rows
for ( r=0; r < len; r++ ) {
rows += '<tr class="ajax-row">'; // new row array
// cells
for ( c in d[r] ) {
if (typeof(c) === "string") {
rows += '<td>' + d[r][c] + '</td>'; // add each table cell data to row array
}
}
rows += '</tr>'; // add new row array to rows array
}
// find first sortable tbody, then add new rows
table.config.$tbodies.eq(0).html(rows);
return [ total ];
}
},
```
* Tablesorter unit testing updates; tests for the following have been added:
* `sortStart`, `sortBegin` &amp; `sortEnd` events.
* `updateComplete` event.
* empty cells: `emptyTo`, empty to `top`, `bottom` &amp; `zero`.
* strings in numeric columns: `stringTo`, string to `max`, `min`, `top`, `bottom` &amp; `none`.
* `sort` method
* table class, table header class &amp; tbody info only class.
#### <a name="v2.9.1">Version 2.9.1</a> (4/13/2013)
* Modified `stickHeaders`:
@ -204,114 +354,3 @@ View the [complete listing here](https://github.com/Mottie/tablesorter/wiki/Chan
* Fixed a bug in the grouping widget demo:
* The "priority (letter)" column was incorrectly parsing the data which, for some reason, worked in some browsers.
* Thanks again to [thezoggy](https://github.com/thezoggy) for reporting [this issue](https://github.com/Mottie/tablesorter/issues/267).
#### <a name="v2.8.1">Version 2.8.1</a> (3/27/2013)
* Added `customAjaxUrl` option to the pager:
* This function is called after all processing has been applied to the `ajaxUrl` string.
* Use this function to make any other string modifications, as desired.
* Thanks to [Cthulhu59](https://github.com/Cthulhu59) for contributing. See [pull request #256](https://github.com/Mottie/tablesorter/pull/256).
#### <a name="v2.8.0">Version 2.8.0</a> (3/27/2013)
* Added an `updateAll` method
* This method allows you to update the cache with data from both the `thead` and `tbody` of the table.
* The `update` method only updates the cache from the `tbody`.
* This fixes [issue #262](https://github.com/Mottie/tablesorter/issues/262).
* Added a grouping rows widget:
* It only works in tablesorter 2.8+ and jQuery v1.7+.
* This widget was added to a subfolder named `widgets` within the `js` directory.
* A group header is added, after sorting a column, which groups rows that match the selector.
* Selectors include whole words, letters, numbers and dates (year, month, day, weekday and time).
* Check out [the demo](http://mottie.github.com/tablesorter/docs/example-widget-grouping.html) and get more details on how to use the widget there.
* Thanks to [Brian Ghidinelli](http://www.ghidinelli.com/) for sharing his custom widget code.
* Added multiple parsers
* [Month](http://mottie.github.com/tablesorter/docs/example-parsers-dates.html)
* [Two digit year](http://mottie.github.com/tablesorter/docs/example-parsers-dates.html) (mmddyy, ddmmyy and yymmdd)
* [Weekday](http://mottie.github.com/tablesorter/docs/example-parsers-dates.html)
* [Date library](http://mottie.github.com/tablesorter/docs/example-parsers-dates.html) (sugar &amp; datejs)
* ISO 8601 date by [Sean Ellingham](https://github.com/seanellingham) (no demo, yet)
* [Metric prefixes](http://mottie.github.com/tablesorter/docs/example-parsers-metric.html)
* [Ignore leads](http://mottie.github.com/tablesorter/docs/example-parsers-ignore-articles.html) parser (ignores "A", "An" and "The" in titles)
* [Inputs, checkbox and select parsers](http://mottie.github.com/tablesorter/docs/example-widget-grouping.html). These parsers automatically update on element changes, but requires jQuery 1.7+.
* Tablesorter's "update" method now checks if a column sort has been enabled or disabled:
* Please note that the sorter precendence (order of priority) is still inforced ([reference](http://mottie.github.com/tablesorter/docs/example-options-headers.html)).
* So, for example, if you add a "sorter-false" class name to the header, it will disable the column sort if **no** jQuery data, metadata, headers option or other `"sorter-{some parser}" class name is already in place.
* To make sure a column becomes disabled, set it's jQuery data, then update:
```javascript
$('th:eq(0)').data('sorter', false);
$('table').trigger('update');
```
* Thanks to dibs76 for asking about this on [StackOverflow](http://stackoverflow.com/questions/15222170/jquery-tablesorter-addclasssorter-false-not-disabling-sort).
* This is also related to [issue #262](https://github.com/Mottie/tablesorter/issues/262).
* Custom parsers detection now has higher priority over default parsers:
* If your custom parser just has an `is()` check that only returns false, nothing will change. You can still set the parser using jQuery data, metadata, the `headers` option or header class name as usual (in this [order of priority](http://mottie.github.com/tablesorter/docs/example-parsers-class-name.html)).
* What this means is that if you wrote a custom parser with an `is()` check (which tests the string and returns a boolean where `true` shows a match for your parser), it would have previously been checked after all of the default parsers were checked.
* Now the automatic parser detection works in reverse, from newest (custom parsers) to oldest (default parsers). So the default text and digit parsers will always be checked last.
* The `addWidget` method will now extend an included `options` object into the widget options (`table.config.widgetOptions`).
* Default widgets will not use this functionality until version 3.0, to keep them backwards compatible.
* Include any widget options, when writing a new widget, as follows:
```javascript
// *******************
// parameters:
// table = table object (DOM)
// c = config object (from table.config)
// wo = all widget options (from table.config.widgetOptions)
$.tablesorter.addWidget({
id: 'myWidget',
// widget options (added v2.8) - added to table.config.widgetOptions
options: {
myWidget_option1 : 'setting1',
myWidget_option2 : 'setting2'
},
// The init function (added v2.0.28) is called only after tablesorter has
// initialized, but before initial sort & before any of the widgets are applied.
init: function(table, thisWidget, c, wo){
// widget initialization code - this is only *RUN ONCE*
// but in this example, only the format function is called to from here
// to keep the widget backwards compatible with the original tablesorter
thisWidget.format(table, config, widgetOptions, true);
},
format: function(table, c, wo, initFlag) {
// widget code to apply to the table *AFTER EACH SORT*
// the initFlag is true when this format is called from the init
// function above otherwise initFlag is undefined
// * see the saveSort widget for a full example *
// access the widget options as follows:
if (wo.myWidget_option1 === 'setting1') {
alert('YAY');
}
},
remove: function(table, c, wo){
// do what ever needs to be done to remove stuff added by your widget
// unbind events, restore hidden content, etc.
}
});
```
* Updated the demo showing how you can write your own widget
* Updated all methods to stop event propagation past the table. This prevents sorted inner tables from also sorting the outer table. Fixes [issue #263](https://github.com/Mottie/tablesorter/issues/263).
* Updated filter widget to restore previous search after an update. Fixes [issue #253](https://github.com/Mottie/tablesorter/issues/253).
* Updated bower manifest file, thanks to [joyvuu-dave](https://github.com/joyvuu-dave) for the [pull request #252](https://github.com/Mottie/tablesorter/pull/252).
* Updated several public methods that require a table element:
* These methods will now accept either a <em>table DOM element</em> or a <em>jQuery object</em>; previously it would only accept a DOM element.
* Modified these `$.tablesorter` functions: `isProcessing`, `clearTableBody`, `destroy`, `applyWidget` and `refreshWidgets`.
* Example: `$.tablesorter.destroy( document.getElementById('myTable') );` or `$.tablesorter.destroy( $('#myTable') );`
* See [issue #243](https://github.com/Mottie/tablesorter/issues/243).
* Updated Bootstrap from version 2.1.1 to 2.3.1.
* Fixed issue with bootstrap demo not working in IE7. It was a silly trailing comma. Fixes [issue #265](https://github.com/Mottie/tablesorter/issues/265).
* Fixed the filter widget to work properly across tbodies. It now leaves non-sortable tbodies intact. Fixes [issue #264](https://github.com/Mottie/tablesorter/issues/264).
* Fixed the `updateCell` method which would cause a javascript error when spammed. It would try to resort the table while the tbody was detached.
* Fixed `shortDate` parser so that it no longer detects semantic version numbers (e.g. "1.0.0").
* Fixed the internal `getData()` function to properly get dashed class names; e.g. `"sorter-my-custom-parser"` will look for a parser with an id of `"my-custom-parser"`.
* Fixed IE code examples all appearing in line.
* Did some general code cleanup and rearranging.

View File

@ -1,6 +1,6 @@
/*!
* tablesorter pager plugin
* updated 5/7/2013
* updated 5/8/2013
*/
/*jshint browser:true, jquery:true, unused:false */
;(function($) {

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
{
"name": "tablesorter",
"version": "2.9.1",
"version": "2.10.0",
"dependencies": {
"jquery": ">=1.2.6"
}

View File

@ -29,7 +29,7 @@ pre.normal {background-color:transparent;border:none;border-left-width:0;overflo
#main {margin:0 20px 20px;padding:0 15px 15px 0;clear:both;}
#content {padding:20px;}
#busy {background-color:#e95555;border:1px ridge #ccc;color:#eee;display:none;padding:3px;position:absolute;right:7px;top:7px;}
#start,#case {color:#007baa;}
#start,#case,.bright {color:#007baa;}
#demo strong {color:#a00;}
hr {height:1px;}
ul {color:#333;list-style:square;}
@ -38,6 +38,7 @@ ul {color:#333;list-style:square;}
#banner h1 {display:block;float:left;}
#banner h1 em,.demo h1 em {color:#6cf;}
#banner h2 {float:right;font-size:26px;margin:10px 10px -10px -10px;}
#root #banner h2 { margin-right: 100px; }
#banner h3 {clear:both;display:block;font-size:12px;margin-top:-20px;border-bottom:1px solid #888;}
#banner a {display:block;font-size:14px;margin:5px 0 0;padding:10px 0 0;float:right;}
a.external {background-image:url(../img/external.png);background-position:center right;background-repeat:no-repeat;padding-right:12px;}
@ -45,7 +46,7 @@ form {font-size:10pt;margin-bottom:20px;width:auto;}
form fieldset {padding:10px;text-align:left;width:140px;}
div#main h1 {border-bottom:1px solid #CDCDCD;display:block;margin-top:20px;padding:10px 0 2px;}
table#tablesorter-demo {margin: 10px 0 0 0;}
table *, p.small {font-size:small;}
table, p.small {font-size:small;}
p.small {padding-left: 25px;}
p.tip em, div.tip em {padding: 2px; background-color: #6cf; color: #fff;}
span.tip em {padding: 0 2px;background-color: #00ce53; color: #fff; font-size:90%; }

View File

@ -44,7 +44,7 @@
<em>NOTE!</em>
<ul>
<li>The custom sort used here is from the original tablesorter plugin v2.0.3. Sort the first column to see how it sorts alphanumeric data.</li>
<li>This option is not part of the original plugin. <span class="tip"><em>New! v2.2</em></span></li>
<li>This option is not part of the original plugin (v2.2).</li>
</ul>
</p>

View File

@ -60,7 +60,7 @@
<ul>
<li>The textExtraction function setting for each column was added in version 2.0.12 (not part of the original plugin).</li>
<li>The "First Name" column is sorting by the contents of the &lt;strong&gt; tag (in red).</li>
<li>Added "table" and "cellIndex" variables to the textExtraction function. <span class="tip"><em>New!</em></span> version 2.1.2.</li>
<li>Added "table" and "cellIndex" variables to the textExtraction function (v2.1.2).</li>
</ul>
</p>

View File

@ -66,6 +66,12 @@
return url;
},
// add more ajax settings here
// see http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings
ajaxObject: {
dataType: 'json'
},
// process ajax so that the following information is returned:
// [ total_rows (number), rows (array of arrays), headers (array; optional) ]
// example:
@ -79,6 +85,8 @@
// ],
// [ "header1", "header2", ... "headerN" ] // optional
// ]
// OR
// return [ total_rows, $rows (jQuery object; optional), headers (array; optional) ]
ajaxProcessing: function(data){
if (data && data.hasOwnProperty('rows')) {
var r, row, c, d = data.rows,
@ -102,6 +110,7 @@
}
rows.push(row); // add new row array to rows array
}
// in version 2.10, you can optionally return $(rows) a set of table rows within a jQuery object
return [ total, rows, headers ];
}
},
@ -156,11 +165,12 @@
<div class="tip">
<em>NOTE!</em>:
<ul>
<li>In <span class="version updated">v2.10</span>, The <code>ajaxProcessing</code> function was updated to only require a total number of rows to be returned, also instead of returning an array of table rows, you can build the table yourself and just return the jQuery object containing those rows. The addon triggers an update.</li>
<li><code>{filterList:fcol}</code> was added to the <code>ajaxUrl</code> in version 2.6.</li>
<li><code>{sortList:col}</code> was added to the <code>ajaxUrl</code> in version 2.4.5.</li>
<li>This update to the pager plugin that interacts with a database via ajax was added in version 2.0.32 and can be applied to the original tablesorter.</li>
<li>The <code>ajaxUrl</code> and <code>ajaxProcessing</code> function are both required options for this interaction to work properly.</li>
<li>The <code>ajaxUrl</code> contains a replaceable string to sent the requested page (<code>{page}</code>), block size (<code>{size}</code>) or sort order (<code>{sortList:name}</code>).</li>
<li>The <code>ajaxUrl</code> contains a replaceable string to send the requested page (<code>{page}</code>), block size (<code>{size}</code>) or sort order (<code>{sortList:name}</code>).</li>
<li>The <code>ajaxProcessing</code> function is needed to convert your custom JSON format into an array usable by the pager plugin (modified in 2.1.3)<br>
<br>
So, given this custom JSON format (this is only an example):
@ -192,7 +202,8 @@
"District": "Noord-Holland",
"Population": 110722
}]
}</pre>The <code>ajaxProcessing</code> function must* return the data in the following format <code>[ total, rows, headers (optional) ]</code>, or in version 2.9+ <code>[ rows, total, headers (optional) ]</code>:
}</pre>The <code>ajaxProcessing</code> function can return the data in the following format <code>[ total, rows, headers (optional) ]</code>, or in version 2.9+ <code>[ rows, total, headers (optional) ]</code>,
<br> or in <span class="version">v2.10</span>, return a jQuery object <code>[ total, $rows ]</code>, or just <code>[ total ]</code>:
<pre class="prettyprint lang-javascript">[
// total # rows contained in the database
80,
@ -206,10 +217,12 @@
[ "ID", "Name", "Country Code", "District", "Population" ] // [ "Header1", "Header2", ... "HeaderN" ] (optional)
]</pre></li>
<li>The table header and footer text will be updated to match the JSON "header column #" text; but there is an issue with the table rendering improperly if the number of columns in the HTML and the number of columns in the JSON don't match.</li>
<li>Limitations of this demo:
<li><strong>Limitations of this demo</strong>:
<ul>
<li>This demo will not work when viewing it locally due to communication restrictions between the browser and your desktop.</li>
<li>The record size is limited to 25 records because this demo is not interacting with an actual database, but with four JSON files containing 25 records each.</li>
<li>Sorting of columns is enabled in this demo by setting the <code>serverSideSorting</code> option to <code>false</code> after initialization. It only sorts the current table contents because there is no server to return sorted data.</li>
<li>The filters will only update the "Current Ajax url" because again, we're just working with JSON files here.</li>
</ul>
</li>
</ul>
@ -374,8 +387,6 @@ td.pager {
</div>
<script>
// allow THIS demo to sort the content; this variable is automatically set to true when ajax
// is used as there isn't any way to sort the server side data from the client side.
var $url = $('#url');
$('table')
@ -384,9 +395,11 @@ $('table')
$url.html(url);
})
// show original URL & updated URL in demo
.on('pagerInitialized', function(){
// allow THIS demo to sort the content; this variable is automatically set to true when ajax
// is used as there isn't any way to sort the server side data from the client side.
this.config.serverSideSorting = false;
// show original highlighted URL
$('#origurl').html( this.config.pager.ajaxUrl.replace(/(\{.*?\})/g, '<span class="results">$1</span>') );
});
</script>

View File

@ -78,7 +78,8 @@
cssPageSize: '.pagesize', // page size selector - select dropdown that sets the "size" option
// class added to arrows when at the extremes (i.e. prev/first arrows are "disabled" when on the first page)
cssDisabled: 'disabled' // Note there is no period "." in front of this class name
cssDisabled: 'disabled', // Note there is no period "." in front of this class name
cssErrorRow: 'tablesorter-errorRow' // ajax error information row
};

View File

@ -49,7 +49,7 @@
<em>NOTE!</em>
<ul>
<li>This parser can not be applied to the original plugin.</li>
<li>Set the language to use by adding any of the following (they all do the same thing), set in order of priority <span class="tip"><em>New!</em></span> v2.8.2:
<li>Set the language to use by adding any of the following (they all do the same thing), set in order of priority (<span class="version">v2.8.2</span>):
<ul>
<li>jQuery data <code>data-ignore-articles="fr"</code>.</li>
<li>metadata <code>class="{ ignoreArticles : 'fr' }"</code>. This requires the metadata plugin.</li>

View File

@ -22,8 +22,12 @@
$("table").tablesorter({ theme: 'blue' });
// ****************************************
// sort the "First Name" and "Age" columns
// ****************************************
$("#trigger-link").click(function() {
// set sorting column and direction, this will sort on the first and third column the column index starts at zero
// set sorting column and direction, this will sort on the
// first and third column the column index starts at zero
var sorting = [[0,0],[2,0]];
// sort on the first column and third columns
$("table").trigger("sorton",[sorting]);
@ -31,6 +35,15 @@
return false;
});
// ****************************************
// toggle the sort on the 5th column
// (Discount) - New in v2.9!
// ****************************************
$("#toggle-link").click(function() {
$("table thead").find("th:eq(4)").trigger("sort");
return false;
});
});</script>
</head>
<body>
@ -97,7 +110,10 @@
</tbody>
</table>
<a href="#" id="trigger-link">Sort first and third columns</a></div>
<a href="#" id="trigger-link">Sort first and third columns</a> |
<a href="#" id="toggle-link">Toggle sort on the "Discount" column</a> (v2.9)
</div>
<h1>Javascript</h1>
<div id="javascript">
<pre class="prettyprint lang-javascript"></pre>

View File

@ -64,7 +64,7 @@
<p class="tip">
<em>NOTE!</em>
<ul>
<li>This demo uses the <code>updateAll</code> method. <span class="tip"><em>New</em></span> v2.8.</li>
<li>This demo uses the <code>updateAll</code> method (<span class="version">v2.8</span>).</li>
<li>This method allows you to update the cache with data from both the <code>thead</code> and <code>tbody</code> of the table.</li>
<li>The <code>update</code> method only updates the cache from the <code>tbody</code>.</li>
</ul>

View File

@ -86,7 +86,7 @@ $(function() {
<li>As of tablesorter version 2.9+, this widget can no longer be applied to versions of tablesorter prior to version 2.8.</li>
<li>Older versions of this widget can be applied to the original plugin. The code is in the "jquery.tablesorter.widgets.js" file.</li>
<li>The original "widgetColumns" option has been replaced by "widgetOptions.columns". See the javascript block below for more details (v2.1).</li>
<li>Table header and footer rows now get updated with the columns widget classes. Check out the "grey" theme to see. <span class="tip"><em>New! v2.4</em></span></li>
<li>Table header and footer rows now get updated with the columns widget classes. Check out the "grey" theme to see (v2.4).</li>
</ul>
</p>

View File

@ -93,6 +93,7 @@
<div>
<ul>
<li>As of tablesorter version 2.9+, this widget can no longer be applied to versions of tablesorter prior to version 2.8.</li>
<li>At this time, these widgets do not work with the sticky header widget.
<li>This page shows you how to add a few default <strong>HTML5 elements</strong> to interact with the filter widget.</li>
<li>If the HTML5 elements are not supported by your browser, you'll just see an input.</li>
<li>Custom filter widget option <code>filter_formatter</code> was added in version 2.7.7.</li>

View File

@ -58,6 +58,9 @@
// css class applied to the table row containing the filters & the inputs within that row
filter_cssFilter : 'tablesorter-filter',
// class added to filtered rows (rows that are not showing); needed by pager plugin
filter_filteredRow : 'filtered',
// add custom filter elements to the filter row
// see the filter formatter demos for more specifics
filter_formatter : null,
@ -118,7 +121,6 @@
filters.eq(col).val(txt).trigger('search', false);
******/
/*** second method ***
this method bypasses the filter inputs, so the "filter_columnFilters"
option can be set to false (no column filters showing)
@ -178,21 +180,22 @@ $(function(){
<li>This widget does work with tablesorter v2.0.5.</li>
<li>Using the filters:
<table class="tablesorter-blue">
<thead><tr><th>Type</th><td>Description</th><th>Example</th></tr></thead>
<thead><tr><th>Type <small class="bright">(1)</small></th><td>Description</th><th>Example</th></tr></thead>
<tbody>
<tr><td class="center">text</td><td>Any text entered in the filter will <strong>match</strong> text found within the column</td><td><code>abc</code> (finds "abc", "abcd", "abcde", etc)</td></tr>
<tr><td class="center"><code>"</code></td><td>To exactly match the search query, add a quote, apostrophe or equal sign to the beginning and/or end of the query</td><td><code>abc"</code> or <code>abc=</code> (exactly match "abc")</td></tr>
<tr><td class="center"><code>?</code></td><td>Wildcard for a single, non-space character.</td><td><code>J?n</code> (finds "Jan" and "Jun", but not "Joan")</td></tr>
<tr><td class="center"><code>*</code></td><td>Wildcard for zero or more non-space characters.</td><td><code>B*k</code> (matches "Black" and "Book")</td></tr>
<tr><td class="center"><code>/\d/</code></td><td>Add any regex to the query to use in the query</td><td><code>/b[aeiou]g/i</code> (finds "bag", "beg", "BIG", "Bug", etc)</td></tr>
<tr><td class="center"><code>&lt; &lt;= &gt;= &gt;</code></td><td>Find alphabetical or numerical values less than or greater than or equal to the filtered query</td><td><code>&gt;= 10</code> (find values greater than or equal to 10)</td></tr>
<tr><td class="center"><code>&lt; &lt;= &gt;= &gt;</code></td><td>Find alphabetical or numerical values less than or greater than or equal to the filtered query <small class="bright">(2)</small></td><td><code>&gt;= 10</code> (find values greater than or equal to 10)</td></tr>
<tr><td class="center"><code>!</code></td><td>Not operator. Filter the column with content that <strong>do not</strong> match the query.</td><td><code>!fe</code> (hide rows with "female" in that column, but shows rows with "male")</td></tr>
<tr><td class="center"><code>&nbsp;&&&nbsp;</code> or <code>&nbsp;AND&nbsp;</code></td><td>Logical "and". Filter the column for content that matches text from either side of the operator.</td><td><code>box && bat</code> (matches a column cell that contains both "box" and "bat")</td></tr>
<tr><td class="center"><code>|</code> or <code>&nbsp;OR&nbsp;</code></td><td>Logical "or" (Vertical bar). Filter the column for content that matches text from either side of the bar.</td><td><code>box|bat</code> (matches a column cell with either "box" or "bat")</td></tr>
<tr><td class="center"><code>&nbsp;-&nbsp;</code> or <code>&nbsp;to&nbsp;</code></td><td>Find a range of values. Make sure there is a space before and after the dash (or the word "to").</td><td><code>10 - 30</code> or <code>10 to 30</code> (match values between 10 and 30)</td></tr>
<tr><td class="center"><code>&nbsp;-&nbsp;</code> or <code>&nbsp;to&nbsp;</code></td><td>Find a range of values. Make sure there is a space before and after the dash (or the word "to") <small class="bright">(2)</small>.</td><td><code>10 - 30</code> or <code>10 to 30</code> (match values between 10 and 30)</td></tr>
</tbody>
</table>
* Note: You cannot combine these operators with each other (except for the wildcards).
<span class="bright">(1)</span> You cannot combine these operators with each other (except for the wildcards).<br>
<span class="bright">(2)</span> In tablesorter <span class="version">v2.10</span>, comparisons can be made in date columns (if properly parsed).
</li>
</ul>
</div>
@ -204,11 +207,12 @@ $(function(){
<li><code>filter_childRows : false</code> - if true, filter includes child row content in the search.</li>
<li><code>filter_columnFilters : true</code> - if true, a filter will be added to the top of each table column.</li>
<li><code>filter_cssFilter : 'tablesorter-filter'</code> - css class name added to the filter row & each input in the row.</li>
<li><code>filter_filteredRow : 'filtered'</code> - css class name added to filtered rows (rows that are not showing); needed by pager plugin.</li>
<li><code>filter_formatter : null</code> - add custom filter elements to the filter row.</li>
<li><code>filter_functions : null</code> - add custom filter functions using this option.</li>
<li><code>filter_hideFilters : false</code> - if true, filters are hidden initially, but can be revealed by clicking on the filter icon.</li>
<li><code>filter_ignoreCase : true</code> - if true, make all searches case-insensitive.</li>
<li><code>filter_liveSearch : true</code> - if true, search column content while the user types (with a delay).</li>
<li><code>filter_liveSearch : true</code> - if true, search column content while the user types (with a delay). If false, the user must press enter to start the search. If set to a number, when the length of the input text reaches this minimum length, a search will initiate.</li>
<li><code>filter_reset : null</code> - jQuery selector string of an element used to reset the filters.</li>
<li><code>filter_searchDelay : 300</code> - typing delay in milliseconds before starting a search.</li>
<li><code>filter_serversideFiltering : false</code> - if true, filter will be done server-side. The client-side filtering will be disabled, but the ui and events will still be used..</li>
@ -219,6 +223,7 @@ $(function(){
<h3><a href="#">Classes</a></h3>
<div>
Class names that can be added to the <code>th</code> header cells:
<ul>
<li><code>filter-false</code> - disable the filter for a specific header column.</li>
<li><code>filter-select</code> - build a default select box for a column (shows unique column content). See the <a href="example-widget-filter-custom.html">custom filter widget</a> demo for an example.</li>
@ -250,14 +255,14 @@ $('table').trigger('search', [ columns ]);</pre>
<h3>Get current filters</h3>
<blockquote>
Get an array of the currently applied filters <span class="tip"><em>New!</em></span> v2.9.
Get an array of the currently applied filters (<span class="version">v2.9</span>).
<pre class="prettyprint lang-javascript">$.tablesorter.getFilters( $('table') ); // or $('table.hasFilters')</pre>
This method returns an array of filter values or <code>false</code> if the selected table does not contain a filter row.
</blockquote>
<h3>Set current filters</h3>
<blockquote>
Set the values of the actual filters using this method; include a <code>true</code> boolean to actually apply the search <span class="tip"><em>New!</em></span> v2.9.
Set the values of the actual filters using this method; include a <code>true</code> boolean to actually apply the search (<span class="version">v2.9</span>).
<pre class="prettyprint lang-javascript">// update filters, but don't apply the search
$.tablesorter.setFilters( $('table'), [ '', '', '', '', '', '2?%' ] );
@ -267,6 +272,15 @@ $.tablesorter.setFilters( $('table'), [ '', '', '', '', '', '2?%' ], true );</pr
</blockquote>
</div>
<h3><a href="#">Events</a></h3>
<div>
<ul>
<li><code>filterEnd</code> - Event triggered when the filter widget has finished processing the search.</li>
<li><code>filterInit</code> - Event triggered when the filter widget has finished initializing.</li>
<li><code>filterStart</code> - Event triggered when the filter widget has started processing the search.</li>
</ul>
</div>
<h3><a href="#">Changes</a></h3>
<div class="inner">
<p>Moved to the wiki pages - <a href="https://github.com/Mottie/tablesorter/wiki/Change3">filter change log</a>.

View File

@ -60,8 +60,8 @@
<li>This widget now saves all changed column widths to local storage, or it falls back to a cookie! (v2.1)</li>
<li>Column width saving requires the new "$.tablesorter.storage()" function included with the "jquery.tablesorter.widgets.js" file (v2.1).</li>
<li>Right clicking (opening the context menu) will now reset the resized columns (v2.4).</li>
<li>Holding down the shift key while resizing will force the last column or the table to resize instead of the next column, but only if the table is full width. <span class="tip"><em>New!</em></span> v2.7.4.</li>
<li>Prevent resizing a column by adding any of the following (they all do the same thing), set in order of priority <span class="tip"><em>New!</em></span> v2.7.4:
<li>Holding down the shift key while resizing will force the last column or the table to resize instead of the next column, but only if the table is full width (v2.7.4).</li>
<li>Prevent resizing a column by adding any of the following (they all do the same thing), set in order of priority (v2.7.4):
<ul>
<li>jQuery data <code>data-resizable="false"</code>.</li>
<li>metadata <code>class="{ resizable: 'false'}"</code>. This requires the metadata plugin.</li>
@ -72,7 +72,7 @@
<li>Setting the <code>resizable</code> widget option to <code>false</code>, will only prevent the saving of resized columns, it has nothing to do with preventing a column from being resized.</li>
<li>Because this widget uses jQuery's <code>closest()</code> (jQuery 1.3+) and <code>index()</code> (jQuery 1.4+) functions, it requires these newer versions of jQuery in order to work.</li>
<li>In order to save the resized widths, jQuery version 1.4.1+ should be used because jQuery's <code>parseJson()</code> function is needed.</li>
<li>Setting the <code>resizable_addLastColumn</code> widget option to <code>true</code> will add the resizable handle to the last column, see the "non-full" width table below <span class="tip"><em>New!</em></span> v2.9.0.</li>
<li>Setting the <code>resizable_addLastColumn</code> widget option to <code>true</code> will add the resizable handle to the last column, see the "non-full" width table below (<span class="version">v2.9.0</span>).</li>
</ul>
</p>

View File

@ -53,7 +53,7 @@
<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 "$.tablesorter.storage()" function included with the "jquery.tablesorter.widgets.js" file (v2.1).</li>
<li>Because this widget uses jQuery's <code>parseJson()</code> function, it requires jQuery version 1.4.1+.</li>
<li>Added a <code>saveSortReset</code> method which only clears the stored information. <span class="tip"><em>New! v2.7.11</em></span>
<li>Added a <code>saveSortReset</code> method which only clears the stored information (v2.7.11).</li>
</ul>
</p>

View File

@ -57,7 +57,7 @@
});
}); </script>
});</script>
<script>
$(function() {
$('link.theme').each(function(){ this.disabled = true; });
@ -68,7 +68,7 @@ $(function() {
o += '<option>' + t[i] + '</option>';
}
$('select')
$('select:first')
.append(o)
.change(function(){
var theme = $(this).val().toLowerCase(),
@ -97,14 +97,15 @@ $(function() {
<em>NOTE!</em>
<ul>
<li>As of tablesorter version 2.9+, this widget can no longer be applied to versions of tablesorter prior to version 2.8.</li>
<li>Added a widget option named <code>stickyHeaders_cloneId</code> <span class="tip"><em>New!</em></span> v2.9!
<li>Added a widget option named <code>stickyHeaders_cloneId</code> (<span class="version">v2.9</span>)
<ul>
<li>It contains a suffix to add to any table id.</li>
<li>Its default value is <code>-sticky</code> </li>
</ul>
</li>
<li>Table captions and any additional rows (filter widget row) will also be included in the sticky header <span class="tip"><em>New!</em></span> v2.9!</li>
<li>You will need to modify the <code>headerTemplate</code> option to include the jQuery UI icon! See the example in the code. <span class="tip"><em>New!</em></span> v2.7!</li>
<li>To access the added sticky table content from your code without worrying about using the ID, you can use <code>table.config.widgetOptions.$sticky</code>.</li>
<li>Table captions and any additional rows (filter widget row) will also be included in the sticky header (<span class="version">v2.9</span>).</li>
<li>You will need to modify the <code>headerTemplate</code> option to include the jQuery UI icon! See the example in the code (v2.7).</li>
<li>Scroll down the page to see the headers stick. Then sort the columns using the sticky headers!</li>
<li>Added a widget option named <code>stickyHeader</code> option which contains the css class name applied to the actual sticky header (v2.1).</li>
<li>Multiple rows in the header will become sticky (v2.1.17).</li>

View File

@ -83,7 +83,7 @@
<em>NOTE!</em>
<ul>
<li>As of tablesorter version 2.9+, this widget can no longer be applied to versions of tablesorter prior to version 2.8.</li>
<li>You will need to modify the <code>headerTemplate</code> option to include the bootstrap icon! See the example in the code. <span class="tip"><em>New!</em></span> v2.7!</li>
<li>You will need to modify the <code>headerTemplate</code> option to include the bootstrap icon! See the example in the code (v2.7).</li>
<li>The original "widgetUitheme" option has been replaced by "widgetOptions.uitheme". See the javascript block below for more details (v2.1).</li>
<li>In tablesorter v2.4, the <code>uitheme</code> option has changed to indicate the theme instead of an array of icons to use:
<ul>

View File

@ -60,7 +60,7 @@ table.tablesorter tbody tr.alt-row td {
<em>NOTE!</em>
<ul>
<li>This widget is part of the plugin, but has been modified from the original.</li>
<li>The original "widgetZebra" option has been replaced by "widgetOptions.zebra". See the javascript block below for more details. <span class="tip"><em>New! v2.1</em></span></li>
<li>The original "widgetZebra" option has been replaced by "widgetOptions.zebra". See the javascript block below for more details (v2.1).</li>
<li>If the "widgetZebra" option exists, it will over-ride this newer "widgetOptions.zebra" option in order to maintain backwards compatibility.</li>
</ul>
</p>

View File

@ -91,14 +91,14 @@
Notes about the <code>addWidget</code> template:
<ul>
<li>The <code>id</code> block is required and must be unique.</li>
<li>The <code>priority</code> block is optional (<span class="tip"><em>New!</em> in v2.9</span>):
<li>The <code>priority</code> block is optional (<span class="version">v2.9</span>):
<ul>
<li>Set the widget priority using any number; think of it like setting the css z-index.</li>
<li>This tells the plugin the order in which to run the widgets, lowest number priority first.</li>
<li>The default widgets have priorities set in intervals of 10 (see the <a href="index.html#Widget-options"> widget priority table</a>), so to run your custom widget before a specific widget, set your widget priority to less than that number.</li>
</ul>
</li>
<li>The <code>options</code> block (<span class="tip"><em>New!</em> in v2.8</span>):
<li>The <code>options</code> block (<span class="version">v2.8</span>):
<ul>
<li>Include any widget options to be automatically be extended with any set widgetOptions (from <code>table.config.widgetOptions</code>).</li>
<li>This block was added in tablesorter v2.8 and is not supported in older versions!</li>

File diff suppressed because it is too large Load Diff

View File

@ -1,8 +1,7 @@
$(function(){
var $t, t, v, animate,
$("a.external").each(function(){this.target = '_new';});
var cleanupCode = function(code){
cleanupCode = function(code){
return code.replace(/[<>\"\'\t\n]/g, function(m) { return {
'<' : '&lt;',
'>' : '&gt;',
@ -13,6 +12,8 @@ $(function(){
}[m]});
};
$("a.external").each(function(){this.target = '_new';});
// get javascript source
if ($("#js").length) {
$("#javascript pre").addClass('mod').html( cleanupCode( $("#js").html() ) );
@ -26,7 +27,7 @@ $(function(){
// apply to already pre-formatted blocks to add <br> for IE
$('pre:not(.mod)').each(function(){
var $t = $(this);
$t = $(this);
$t.html( cleanupCode( $t.html() ) );
});
@ -40,7 +41,7 @@ $(function(){
return false;
});
var animating = false;
animating = false;
$('.collapsible').hide();
$('.toggle2')
@ -59,17 +60,28 @@ $(function(){
});
$('.toggleAll, .showAll, .hideAll').click(function(){
var t = $.trim($(this).text());
t = $.trim($(this).text());
$(this).parent().next('table').find('.collapsible')[t]();
return false;
});
// update version number
var t = $('.current-version');
if (t.length) {
t.html($.tablesorter.version);
$t = $('.current-version');
if ($t.length) {
$t.html($.tablesorter.version);
}
// add high visibility tags for newest versions (just grab the major revision number 2.10.0 -> 10
v = parseFloat( $.tablesorter.version.split('.')[1] );
console.log(v);
$('.version').each(function(){
$t = $(this);
t = v - parseFloat( $t.text().replace(/(v|version|\+)/g, '').split('.')[1] );
if ( t <= 1 ) {
$t.prepend('<span class="tip' + ( t === 1 ? ' old' : '' ) + '"><em>'+ ($t.hasClass('updated') ? 'Updated' : 'New') + '</em></span> ');
}
});
});
function showProperty(){
@ -91,14 +103,17 @@ function showProperty(){
$(window).load(function(){
if ($('#root').length) {
$(window).bind('hashchange', function(){
showProperty();
});
showProperty();
}
});
// append hidden parsed value to cell
// used by feet-inch-fraction & metric parser demos
var addParsedValues = function($t, cols, format){
var i, j, r,
$r = $t.find('tbody tr'),

View File

@ -1,5 +1,5 @@
/*!
* TableSorter 2.9.1 - Client-side table sorting with ease!
* TableSorter 2.10.0 - Client-side table sorting with ease!
* @requires jQuery v1.2.6+
*
* Copyright (c) 2007 Christian Bach
@ -24,7 +24,7 @@
var ts = this;
ts.version = "2.9.1";
ts.version = "2.10.0";
ts.parsers = [];
ts.widgets = [];

File diff suppressed because one or more lines are too long

View File

@ -1,4 +1,4 @@
/*! Filter widget formatter functions - updated 2/28/2013
/*! Filter widget formatter functions - updated 5/8/2013
* requires: tableSorter 2.7.7+ and jQuery 1.4.3+
*
* jQuery UI spinner
@ -39,14 +39,14 @@ $.tablesorter.filterFormatter = {
updateSpinner = function(ui) {
var chkd = true,
// ui is not undefined on create
v = ui && ui.value || $('#spinner' + indx).val() || o.value;
v = ui && ui.value || $cell.find('.spinner').val() || o.value;
if (o.addToggle) {
chkd = $cell.find('.toggle').is(':checked');
}
$cell.find('.filter')
.val( chkd ? v + (o.exactMatch ? '=' : '') : '' ) // add equal to the end, so we filter exact numbers
.trigger('search', o.delayed).end()
.find('#spinner' + indx).spinner( o.disabled || !chkd ? 'disable' : 'enable' );
.find('.spinner').spinner( o.disabled || !chkd ? 'disable' : 'enable' );
};
// add callbacks; preserve added callbacks
@ -71,7 +71,7 @@ $.tablesorter.filterFormatter = {
// make sure we use parsed data
$cell.closest('thead').find('th[data-column=' + indx + ']').addClass('filter-parsed');
// add a jQuery UI slider!
$('<input id="spinner' + indx + '" />')
$('<input class="spinner spinner' + indx + '" />')
.val(o.value)
.appendTo($cell)
.spinner(o)
@ -143,13 +143,13 @@ $.tablesorter.filterFormatter = {
if (typeof o.oldslide === 'function') { o.oldslide(event, ui); }
};
// add a jQuery UI slider!
$('<div id="slider' + indx + '"/>')
$('<div class="slider slider' + indx + '"/>')
.appendTo($cell)
.slider(o);
// on reset
$cell.closest('table').bind('filterReset', function(){
$cell.find('div[id*="slider"]').slider('value', o.value);
$cell.find('.slider').slider('value', o.value);
updateSlider();
});

File diff suppressed because one or more lines are too long

View File

@ -1,4 +1,4 @@
/*! tableSorter 2.8+ widgets - updated 4/13/2013
/*! tableSorter 2.8+ widgets - updated 5/8/2013
*
* Column Styles
* Column Filters
@ -128,7 +128,8 @@ ts.addHeaderResizeEvent = function(table, disable, options){
};
clearInterval(wo.resize_timer);
if (disable) {
return wo.resize_flag = false;
wo.resize_flag = false;
return false;
}
c.$headers.each(function(){
$.data(this, 'savedSizes', [ this.offsetWidth, this.offsetHeight ]);

File diff suppressed because one or more lines are too long

View File

@ -1,7 +1,7 @@
{
"name": "tablesorter",
"title": "tablesorter",
"version": "2.9.1",
"version": "2.10.0",
"description": "tablesorter is a jQuery plugin for turning a standard HTML table with THEAD and TBODY tags into a sortable table without page refreshes. tablesorter can successfully parse and sort many types of data including linked data in a cell.\n\nThis forked version adds lots of new enhancements including: alphanumeric sorting, pager callback functons, multiple widgets providing column styling, ui theme application, sticky headers, column filters and resizer, as well as extended documentation with a lot more demos.",
"author": {
"name": "Christian Bach",

View File

@ -1,7 +1,7 @@
{
"name": "tablesorter",
"title": "tablesorter",
"version": "2.9.1",
"version": "2.10.0",
"description": "tablesorter is a jQuery plugin for turning a standard HTML table with THEAD and TBODY tags into a sortable table without page refreshes. tablesorter can successfully parse and sort many types of data including linked data in a cell.\n\nThis forked version adds lots of new enhancements including: alphanumeric sorting, pager callback functons, multiple widgets providing column styling, ui theme application, sticky headers, column filters and resizer, as well as extended documentation with a lot more demos.",
"author": {
"name": "Christian Bach",

168
test.html
View File

@ -14,22 +14,64 @@
<script src="testing/testing.js"></script>
<script>
/*
Core plugin tested
========================
OPTIONS:
cssAsc, cssChildRow, cssDesc, cssHeader, cssHeaderRow, cssInfoBlock, dateFormat, emptyTo, headerList,
headers, ignoreCase, initialized, parsers, sortList, sortLocaleCompare, sortReset, stringTo, tableClass,
usNumberFormat, widgets (just zebra)
METHODS:
addRows, applyWidgets, destroy, sorton, sortReset, update/updateRow, updateAll, updateCell
EVENTS:
initialized, sortBegin, sortEnd, sortStart, updateComplete
Not yet tested
=========================
OPTIONS:
cancelSelection, cssIcon, cssProcessing, debug, delayInit, headerTemplate, initWidgets, onRenderHeader,
onRenderTemplate, selectorHeaders, selectorRemove, selectorSort, serverSideSorting, showProcessing,
sortAppend, sortForce, sortInitialOrder, sortMultiSortKey, sortResetKey, sortRestart, strings,
textExtraction, textSorter, theme, widthFixed, widgets (also need priority testing)
METHODS:
appendCache, applyWidgetId, sort, refreshWidgets
EVENTS:
-
*/
$(function(){
var ts = $.tablesorter,
$table1 = $('.tester:eq(0)'),
$table2 = $('.tester:eq(1)'),
$table3 = $('.tester:eq(2)'),
table1 = $table1[0],
table2 = $table2[0],
table3 = $table3[0],
th0 = $table1.find('th')[0], // first table header cell
init = false,
undef, c1, c2, e, i, l, t;
sortIndx = 0,
updateIndx = 0,
updateCallback = 0,
events = ['sortStart', 'sortBegin', 'sortEnd' ],
undef, c1, c2, c3, e, i, l, t;
$table1
.bind('tablesorter-initialized', function(){
init = true;
})
.bind( events.join(' '), function(e){
if (e.type === events[sortIndx%3]) {
sortIndx++;
}
})
.bind('updateComplete', function(){
updateIndx++;
})
.tablesorter();
$table2.tablesorter({
@ -40,6 +82,16 @@
}
});
$table3.tablesorter({
emptyTo: "bottom",
stringTo: "max", // non-numeric content is treated as a MAX value
headers: {
0: { empty : "top" }, // sort empty cells to the top
2: { string: "min" }, // non-numeric content is treated as a MIN value
3: { sorter: "digit", empty : "zero", string : "top" }
}
});
/************************************************
JSHint testing
************************************************/
@ -62,6 +114,7 @@
c1 = table1.config;
c2 = table2.config;
c3 = table3.config;
/************************************************
check isDigit function
@ -223,24 +276,72 @@
/************************************************
test parser cache
************************************************/
test( "parser cache; sorton methods", function() {
expect(3);
test( "parser cache; sorton methods; empty & string", function() {
expect(15);
$table1.trigger('sortReset');
// lower case because table was parsed before c1.ignoreCase was changed
tester.cacheCompare( table1, [ 'test2', 'x2', 'test1', 'x3', 'test3', 'x1', '', '', 'testb', 'x5', 'testc', 'x4', 'testa', 'x6' ], 'unsorted' );
tester.cacheCompare( table1, 'all', [ 'test2', 'x2', 'test1', 'x3', 'test3', 'x1', '', '', 'testb', 'x5', 'testc', 'x4', 'testa', 'x6' ], 'unsorted' );
$table1.trigger('sorton', [[[ 0,0 ]]]);
tester.cacheCompare( table1, [ 'test1', 'x3', 'test2', 'x2', 'test3', 'x1', '', '', 'testa', 'x6', 'testb', 'x5', 'testc', 'x4' ], 'ascending sort' );
tester.cacheCompare( table1, 'all', [ 'test1', 'x3', 'test2', 'x2', 'test3', 'x1', '', '', 'testa', 'x6', 'testb', 'x5', 'testc', 'x4' ], 'ascending sort' );
$table1.trigger('sorton', [[[ 0,1 ]]]);
tester.cacheCompare( table1, [ 'test3', 'x1', 'test2', 'x2', 'test1', 'x3', '', '', 'testc', 'x4', 'testb', 'x5', 'testa', 'x6' ], 'descending sort' );
tester.cacheCompare( table1, 'all', [ 'test3', 'x1', 'test2', 'x2', 'test1', 'x3', '', '', 'testc', 'x4', 'testb', 'x5', 'testa', 'x6' ], 'descending sort' );
// empty cell position
$table3.trigger('sorton', [[[ 0,0 ]]]);
tester.cacheCompare( table3, 0, [ '', 'a1', 'a02', 'a10', 'a33', 'a43', 'a55', 'a87', 'a102', 'a255' ], 'asc sort; empty to top' );
$table3.trigger('sorton', [[[ 0,1 ]]]);
tester.cacheCompare( table3, 0, [ '', 'a255', 'a102', 'a87', 'a55', 'a43', 'a33', 'a10', 'a02', 'a1' ], 'desc sort; empty to top' );
// string position within number column
$table3.trigger('sorton', [[[ 1,0 ]]]);
tester.cacheCompare( table3, 1, [ -35, -5, -1, 1, 2, 4, 33, 44, 'nr', '' ], 'asc sort; empty to bottom; string to max' );
$table3.trigger('sorton', [[[ 1,1 ]]]);
tester.cacheCompare( table3, 1, [ 'nr', 44, 33, 4, 2, 1, -1, -5, -35, '' ], 'desc sort; empty to bottom; string to max' );
$table3.trigger('sorton', [[[ 2,0 ]]]);
tester.cacheCompare( table3, 2, [ 'nr', 'nr', 1, 2, 3, 4, 5, 6, 7, '' ], 'asc sort; empty to bottom; string to min' );
$table3.trigger('sorton', [[[ 2,1 ]]]);
tester.cacheCompare( table3, 2, [ 7, 6, 5, 4, 3, 2, 1, 'nr', 'nr', '' ], 'desc sort; empty to bottom; string to min' );
$table3.trigger('sorton', [[[ 3,0 ]]]);
tester.cacheCompare( table3, 3, [ 'n/a #2', 'n/a #1', -8.4, -2.2, -0.1, '', 5.2, 11.4, 23.6, 97.4 ], 'asc sort; empty to zero; string to top' );
$table3.trigger('sorton', [[[ 3,1 ]]]);
tester.cacheCompare( table3, 3, [ 'n/a #2', 'n/a #1', 97.4, 23.6, 11.4, 5.2, '', -0.1, -2.2, -8.4 ], 'desc sort; empty to zero; string to top' );
$table3.find('th:eq(3)').data('string', 'bottom');
$table3.trigger('update');
tester.cacheCompare( table3, 3, [ 97.4, 23.6, 11.4, 5.2, '', -0.1, -2.2, -8.4, 'n/a #1', 'n/a #2' ], 'desc sort; empty to zero; string to bottom' );
$table3.trigger('sorton', [[[ 3,0 ]]]);
tester.cacheCompare( table3, 3, [ -8.4, -2.2, -0.1, '', 5.2, 11.4, 23.6, 97.4, 'n/a #1', 'n/a #2' ], 'asc sort; empty to zero; string to bottom' );
$table3.find('th:eq(3)').data('string', 'none');
c3.headers[3].empty = "bottom";
c3.sortList = [[ 3, 1 ]]; // added to test sortList
$table3.trigger('update');
tester.cacheCompare( table3, 3, [ 97.4, 23.6, 11.4, 5.2, 'n/a #1', 'n/a #2', -0.1, -2.2, -8.4, '' ], 'desc sort; empty to zero; string to none/zero' );
$table3.trigger('sorton', [[[ 3,0 ]]]);
tester.cacheCompare( table3, 3, [ -8.4, -2.2, -0.1, 'n/a #1', 'n/a #2', 5.2, 11.4, 23.6, 97.4, '' ], 'asc sort; empty to zero; string to none/zero' );
});
test( "sort Events", function(){
expect(1);
// table1 sorted twice in the above test; sortIndx = 6 (3 events x 2)
equal( sortIndx, 6, 'sortStart, sortBegin & sortComplet fired in order' );
});
/************************************************
test update methods
************************************************/
test( "parser cache; update methods", function() {
test( "parser cache; update methods & callbacks", function() {
expect(5);
c1.ignoreCase = true;
@ -251,44 +352,58 @@
return h.substring(1);
});
$table1.trigger('updateAll', [false, function(){
c1 = $table1[0].config;
updateCallback++;
var nw = $table1.find('th:eq(1)')[0],
hc = c1.headerContent[1] === 'num',
hd = c1.$headers[1] === nw,
hl = c1.headerList[1] === nw,
p1 = c1.parsers[1].id === 'digit';
equal(hc && hd && hl && p1, true, 'testing header cache: updateAll - thead');
tester.cacheCompare( table1, [ 'test3', 1, 'test2', 2, 'test1', 3, '', '', 'testc', 4, 'testb', 5, 'testa', 6 ], 'updateAll - tbody' );
tester.cacheCompare( table1, 'all', [ 'test3', 1, 'test2', 2, 'test1', 3, '', '', 'testc', 4, 'testb', 5, 'testa', 6 ], 'updateAll - tbody' );
}]);
// addRows
t = $('<tr class="temp"><td>testd</td><td>7</td></tr>');
$table1.find('tbody:last').append(t);
$table1.trigger('addRows', [t, true, function(){
tester.cacheCompare( table1, [ 'test3', 1, 'test2', 2, 'test1', 3, '', '', 'testd', 7, 'testc', 4, 'testb', 5, 'testa', 6 ], 'addRows method' );
updateCallback++;
tester.cacheCompare( table1, 'all', [ 'test3', 1, 'test2', 2, 'test1', 3, '', '', 'testd', 7, 'testc', 4, 'testb', 5, 'testa', 6 ], 'addRows method' );
}]);
// updateCell
t = $table1.find('td:contains("testd")');
t.html('texte');
$table1.trigger('updateCell', [t[0], true, function(){
tester.cacheCompare( table1, [ 'test3', 1, 'test2', 2, 'test1', 3, '', '', 'texte', 7, 'testc', 4, 'testb', 5, 'testa', 6 ], 'updateCell method' );
updateCallback++;
tester.cacheCompare( table1, 'all', [ 'test3', 1, 'test2', 2, 'test1', 3, '', '', 'texte', 7, 'testc', 4, 'testb', 5, 'testa', 6 ], 'updateCell method' );
}]);
// update
$table1.find('tr.temp').remove();
$table1.trigger('update', [true, function(){
tester.cacheCompare( table1, [ 'test3', 1, 'test2', 2, 'test1', 3, '', '', 'testc', 4, 'testb', 5, 'testa', 6 ], 'update method' );
updateCallback++;
tester.cacheCompare( table1, 'all', [ 'test3', 1, 'test2', 2, 'test1', 3, '', '', 'testc', 4, 'testb', 5, 'testa', 6 ], 'update method' );
}]);
});
test( "UpdateComplete Event", function(){
expect(1);
// table1 updated 4x in the above test
equal( updateIndx, updateCallback, 'updatedComplete and update callback functions working properly' );
});
/************************************************
check header css
************************************************/
test( "testing header css & sortReset method", function(){
expect(3);
expect(7);
t = $(th0);
equal( $table1.hasClass(c1.tableClass), true, 'table class applied');
equal( t.hasClass(c1.cssHeader), true, 'Header class present' );
equal( t.parent().hasClass(c1.cssHeaderRow), true, 'Header row class present' );
equal( $table1.find('tbody:eq(1)').hasClass(c1.cssInfoBlock), true, 'Tbody info block class present' );
$table1.trigger('sorton', [[[ 0,1 ]]] );
equal( t.hasClass(c1.cssDesc), true, 'Descending class present' );
$table1.trigger('sorton', [[[ 0,0 ]]] );
@ -349,8 +464,8 @@
<li>Core tests:
<ul>
<li>Test each option, event & callback</li>
<li>Sorting empty cells.</li>
<li>Sorting strings in numeric columns.</li>
<li><del>Sorting empty cells</del>.</li>
<li><del>Sorting strings in numeric columns</del>.</li>
<li>Internal rendering, caching &amp; indexing utilities.</li>
<li><del>Update methods</del>.</li>
</ul>
@ -397,5 +512,28 @@
</tbody>
</table>
<table class="tester">
<thead>
<tr>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
</tr>
</thead>
<tbody>
<tr><td>A43</td><td>-35</td><td>01</td><td>-.1</td></tr>
<tr><td>A255</td><td>33</td><td>02</td><td>N/A #1</td></tr>
<tr><td>A33</td><td>2</td><td>03</td><td>N/A #2</td></tr>
<tr><td>A1</td><td>-5</td><td>04</td><td>-8.4</td></tr>
<tr><td>A102</td><td>NR</td><td>05</td><td>-2.2</td></tr>
<tr><td>A10</td><td>-1</td><td>06</td><td>97.4</td></tr>
<tr><td>A02</td><td>1</td><td>07</td><td>23.6</td></tr>
<tr><td>A55</td><td>44</td><td></td><td>11.4</td></tr>
<tr><td>A87</td><td>04</td><td>NR</td><td>5.2</td></tr>
<tr><td></td><td></td><td>NR</td><td></td></tr>
</tbody>
</table>
</body>
</html>

View File

@ -1,6 +1,7 @@
/* tables */
.tester { /* */
visibility: hidden;
position: absolute;
top: -999em;
}
/* skipped tests */

View File

@ -64,7 +64,7 @@ var tester = {
/************************************************
test table data cache
************************************************/
cacheCompare : function(table, expected, txt){
cacheCompare : function(table, col, expected, txt){
var i, j = 0, k, l,
result = [],
b = table.tBodies,
@ -72,8 +72,14 @@ var tester = {
for (k = 0; k < b.length; k++){
l = b[k].rows.length;
for (j = 0; j < l; j++) {
if (col === 'all') {
// return all columns
for (i = 0; i < l2; i++) {
result.push( table.config.cache[k].normalized[j] ? table.config.cache[k].normalized[j][i] || '' : '' );
result.push( table.config.cache[k].normalized[j] ? table.config.cache[k].normalized[j][i] : '' );
}
} else {
// return specific column
result.push( table.config.cache[k].normalized[j] ? table.config.cache[k].normalized[j][col] : '' );
}
}
}