diff --git a/README.md b/README.md index d8eecb12..00498cee 100644 --- a/README.md +++ b/README.md @@ -36,6 +36,28 @@ tablesorter can successfully parse and sort many types of data including linked View the [complete listing here](https://github.com/Mottie/tablesorter/wiki/Change). +#### Version 2.7.4 (1/29/2013) + +* Fixed an problem with the pager not pointing to a tbody, and breaking on an empty tbody. See [issue #223](https://github.com/Mottie/tablesorter/issues/223). +* Modified core to always add a `
"+p[b][h]+"";q+=""}r&&r.length===y&&(e=j.hasClass("hasStickyHeaders"),k=j.find("."+(l.widgetOptions&&l.widgetOptions.stickyHeaders||"tablesorter-stickyheader")),g=j.find("tfoot tr:first").children(),j.find("th."+l.cssHeader).each(function(a){var b=d(this),c;b.find("."+l.cssIcon).length?(c=b.find("."+ l.cssIcon).clone(!0),b.find(".tablesorter-header-inner").html(r[a]).append(c),e&&k.length&&(c=k.find("th").eq(a).find("."+l.cssIcon).clone(!0),k.find("th").eq(a).find(".tablesorter-header-inner").html(r[a]).append(c))):(b.find(".tablesorter-header-inner").html(r[a]),k.find("th").eq(a).find(".tablesorter-header-inner").html(r[a]));g.eq(a).html(r[a])}));j.find("thead tr."+c.cssErrorRow).remove();f?j.find("thead").append(m):E.html(q);l.showProcessing&&d.tablesorter.isProcessing(a);j.trigger("update"); c.totalRows=n[0]||0;c.totalPages=Math.ceil(c.totalRows/c.size);u(a,c);t(a,c);c.initialized&&j.trigger("pagerChange",c)}c.initialized||(c.initialized=!0,d(a).trigger("pagerInitialized",c))},v=function(b,a,c){c.isDisabled=!1;var f,h,e,g=document.createDocumentFragment(),k=a.length;f=c.page*c.size;var j=f+c.size;if(!(1>k)){c.initialized&&d(b).trigger("pagerChange",c);if(c.removeRows){j>a.length&&(j=a.length);d(b.tBodies[0]).addClass("tablesorter-hidden");for(d.tablesorter.clearTableBody(b);f "+p[b][h]+"";q+=""}r&&r.length===y&&(e=j.hasClass("hasStickyHeaders"),k=j.find("."+(l.widgetOptions&&l.widgetOptions.stickyHeaders||"tablesorter-stickyheader")),f=j.find("tfoot tr:first").children(),j.find("th."+l.cssHeader).each(function(a){var b=d(this),c;b.find("."+l.cssIcon).length?(c=b.find("."+ l.cssIcon).clone(!0),b.find(".tablesorter-header-inner").html(r[a]).append(c),e&&k.length&&(c=k.find("th").eq(a).find("."+l.cssIcon).clone(!0),k.find("th").eq(a).find(".tablesorter-header-inner").html(r[a]).append(c))):(b.find(".tablesorter-header-inner").html(r[a]),k.find("th").eq(a).find(".tablesorter-header-inner").html(r[a]));f.eq(a).html(r[a])}));j.find("thead tr."+c.cssErrorRow).remove();g?j.find("thead").append(m):d(a.tBodies[0]).html(q);l.showProcessing&&d.tablesorter.isProcessing(a);j.trigger("update"); c.totalRows=n[0]||0;c.totalPages=Math.ceil(c.totalRows/c.size);t(a,c);u(a,c);c.initialized&&j.trigger("pagerChange",c)}c.initialized||(c.initialized=!0,d(a).trigger("pagerInitialized",c))},v=function(b,a,c){c.isDisabled=!1;var g,h,e,f=document.createDocumentFragment(),k=a.length;g=c.page*c.size;var j=g+c.size;if(!(1>k)){c.initialized&&d(b).trigger("pagerChange",c);if(c.removeRows){j>a.length&&(j=a.length);d(b.tBodies[0]).addClass("tablesorter-hidden");for(d.tablesorter.clearTableBody(b);g
To use this option, point to a reset button or link using a jQuery selector. For example, add this button ('+(g?g.message+" ("+g.name+")":"No rows found")+" ",n=c.ajaxProcessing(b)||[0,[]],p=n[1]||[],s=p.length,r=n[2];if(0";for(h=0;hclosest()
function, it requires jQuery 1.3+ in order to work.parseJson()
function, it requires jQuery version 1.4.1+ in order to save the widths.
+
+ data-resizable="false"
.class="{ resizable: 'false'}"
. This requires the metadata plugin.headers : { 0 : { resizable : 'false' } }
.class="resizable-false"
.resizable
widget option to false
, will only prevent the saving of resized columns, it has nothing to do with preventing a column from being resized.closest()
(jQuery 1.3+) and index()
(jQuery 1.4+) functions, it requires these newer versions of jQuery in order to work.parseJson()
function is needed.Demo
-
+
+
+Non-full width table (individual columns resize)
+
-First Name
Last Name
- Age
+ Age
Total
Discount
Date
@@ -109,7 +121,64 @@
Jan 18, 2007 9:12 AM
Full width table (use shift to force last column to resize)
+
+
+
+
+
+
+
+ First Name
+ Last Name
+ Age
+ Total
+ Discount
+ Date
+
+
+ Peter
+ Parker
+ 28
+ $9.99
+ 20%
+ Jul 6, 2006 8:14 AM
+
+
+ John
+ Hood
+ 33
+ $19.99
+ 25%
+ Dec 10, 2002 5:14 AM
+
+
+ Clark
+ Kent
+ 18
+ $15.89
+ 44%
+ Jan 12, 2003 11:14 AM
+
+
+ Bruce
+ Almighty
+ 45
+ $153.19
+ 44%
+ Jan 18, 2001 9:12 AM
+
+
+
+Bruce
+ Evans
+ 22
+ $13.19
+ 11%
+ Jan 18, 2007 9:12 AM
+ Page Header
HTML
- <!-- The Age column is set to not be resizable -->
+<table class="tablesorter" style="width:auto">
+ <thead>
+ <tr>
+ <th>First Name</th>
+ <th>Last Name</th>
+ <th class="resizable-false">Age</th>
+ <th>Total</th>
+ <th>Discount</th>
+ <th>Date</th>
+ </tr>
+ </thead>
+ <tbody>
+ ...
+ </tbody>
+</table>
cssChildRow
String
"tablesorter-childRow"
- Add this css class to a child row that should always be attached to its parent. Click on the "cssChildRow" link to toggle the view on the attached child row. Previous default was "expand-child", Changed! in v2.4.
+ Add this css class to a child row that should always be attached to its parent. Click on the "cssChildRow" link to toggle the view on the attached child row. Previous default was "expand-child" (Changed in v2.4).
Ex:1 2
@@ -502,7 +502,7 @@
@@ -693,7 +693,9 @@
// See the "Applying the filter widget" demo
7: { filter: false }, // disable filter widget for this column
8: { filter: "parsed" }, // use parsed data for this column in the filter search
- 9: { filter: "noquicksearch" } // exclude this column from the advanced filter quick search
+
+ // Set resizable widget options for this column
+ 9: { resizable: false } // prevent resizing of column 9
}
});
@@ -845,7 +847,7 @@ From the example function above, you'll end up with something similar to this HT
cssHeaderRow
String
"tablesorter-headerRow"
- The CSS style used to style the header row. New! v2.4.
+ The CSS style used to style the header row (v2.4).
cssProcessing
String
"tablesorter-processing"
- This class name is added to the header cell that is currently being sorted or filted. To prevent this class name from being added, set the
+ showProcessing
option to false
. New! v2.4.This class name is added to the header cell that is currently being sorted or filted. To prevent this class name from being added, set the
showProcessing
option to false
(v2.4).
jQuery selectors used to find cells in the header.
Added >
to the selector in v2.3 to prevent targetting nested table headers. It was modified again in v2.4 to include td
cells within the thead. Modified! v2.4.
+
Added >
to the selector in v2.3 to prevent targetting nested table headers. It was modified again in v2.4 to include td
cells within the thead.
@@ -868,7 +870,7 @@ From the example function above, you'll end up with something similar to this HT
selectorSort
String
"th, td"
- jQuery selector of content within
+ selectorHeaders
that is clickable to trigger a sort. New! v2.4.jQuery selector of content within
selectorHeaders
that is clickable to trigger a sort (v2.4).Example
@@ -876,7 +878,7 @@ From the example function above, you'll end up with something similar to this HT
serverSideSorting
Boolean
false
- Set to
+ true
if the server is performing the sorting. The ui and events will still be used. New! v2.5.3.Set to
true
if the server is performing the sorting. The ui and events will still be used (v2.5.3).
@@ -884,7 +886,7 @@ From the example function above, you'll end up with something similar to this HT
showProcessing
Boolean
false
- Show an indeterminate timer icon in the header when the table is sorted or filtered. Please note that due to javascript processing, the icon may not show as being animated. I'm looking into this further and would appreciate any feedback or suggestions with the coding. New! v2.4.
+ Show an indeterminate timer icon in the header when the table is sorted or filtered. Please note that due to javascript processing, the icon may not show as being animated. I'm looking into this further and would appreciate any feedback or suggestions with the coding (v2.4).
Example
@@ -1100,7 +1102,7 @@ From the example function above, you'll end up with something similar to this HT
theme
String
"default"
- This option will add a theme css class name to the table "tablesorter-{theme}"
for styling. New v2.4.
+ This option will add a theme css class name to the table "tablesorter-{theme}"
for styling (v2.4).
When changing this theme option, make sure that the appropriate css theme file has also been loaded. Included theme files include:
see all themes
@@ -1212,7 +1214,7 @@ $(function(){
Boolean
false
- Indicates if tablesorter should apply fixed percentage-based widths to the table columns. Modified! v2.4.
+ Indicates if tablesorter should apply fixed percentage-based widths to the table columns (modified v2.4).
@@ -1463,7 +1465,7 @@ $(function(){
Array
true
- Columns widget: If true, the class names from the columns
option will also be added to the table thead. New! v2.4.
+ Columns widget: If true, the class names from the columns
option will also be added to the table thead (v2.4).
Use the "columns_thead"
option to add the column class names to the thead as follows:
@@ -1484,7 +1486,7 @@ $(function(){
Array
true
- Columns widget: If true, the class names from the columns
option will also be added to the table tfoot. New! v2.4.
+ Columns widget: If true, the class names from the columns
option will also be added to the table tfoot (v2.4).
Use the "columns_tfoot"
option to add the column class names to the tfoot as follows:
@@ -1527,7 +1529,7 @@ $(function(){
Boolean
true
- Filter widget: If true
, a filter will be added to the top of each table column. New! v2.4.
+ Filter widget: If true
, a filter will be added to the top of each table column (v2.4).
Use the filter_columnFilters
option as follows:
@@ -1677,7 +1679,7 @@ $(function(){
Boolean
false
- Filter widget: Set this option to true
to hide the filter row initially. The rows is revealed by hovering over the filter row or giving any filter input/select focus. New! v2.4.
+ Filter widget: Set this option to true
to hide the filter row initially. The rows is revealed by hovering over the filter row or giving any filter input/select focus (v2.4).
Use the filter_hideFilters
option as follows:
@@ -1760,7 +1762,7 @@ $(function(){
String
null
- Filter widget: jQuery selector string of an element used to reset the filters. New! v2.4.
+ Filter widget: jQuery selector string of an element used to reset the filters (v2.4).
<button class="reset">Reset</button>
) to the table header, or anywhere else on the page. That element will be used as a reset for all column and quick search filters (clears all fields):
@@ -1817,7 +1819,7 @@ $('table').trigger('search', false);Boolean
false
- Filter widget: Set this option to true
if filtering is performed on the server-side. New! v2.5.3.
+ Filter widget: Set this option to true
if filtering is performed on the server-side (v2.5.3).
Use the filter_serversideFiltering
option as follows:
@@ -1859,7 +1861,7 @@ $('table').trigger('search', false);Boolean
false
- Filter widget: If true
, ALL filter searches will only use parsed data. New! v2.4.
+ Filter widget: If true
, ALL filter searches will only use parsed data (v2.4).
Use the filter_useParsedData
option as follows:
@@ -1914,7 +1916,7 @@ $('table').trigger('search', false);Boolean
true
- Resizable widget: If this option is set to false
, resized column widths will not be saved. Previous saved values will be restored on page reload. New! v2.4.
+ Resizable widget: If this option is set to false
, resized column widths will not be saved. Previous saved values will be restored on page reload (v2.4).
Use the "resizable"
option to change the css class name as follows:
@@ -1936,7 +1938,7 @@ $('table').trigger('search', false);Boolean
true
- saveSort widget: If this option is set to false
, new sorts will not be saved. Any previous saved sort will be restored on page reload. New! v2.4.
+ saveSort widget: If this option is set to false
, new sorts will not be saved. Any previous saved sort will be restored on page reload (v2.4).
Use the "saveSort"
option to change the css class name as follows:
@@ -1958,26 +1960,26 @@ $('table').trigger('search', false);String
"jui"
- ** Updated! in tablesorter v2.4 **
-
- Instead of the array of icon class names, this option now contains the name of the theme. Currently jQuery UI ("jui") and Bootstrap ("bootstrap") themes are supported. To modify the class names used, extend from the theme
+ Instead of the array of icon class names, this option now contains the name of the theme. Currently jQuery UI ("jui") and Bootstrap ("bootstrap") themes are supported. To modify the class names used, extend from the theme (updated v2.4)
// Extend the themes to change any of the default class names ** NEW **
$.extend($.tablesorter.themes.jui, {
// change default jQuery uitheme icons - find the full list of icons
// here: http://jqueryui.com/themeroller/ (hover over them for their name)
- table : 'ui-widget ui-widget-content ui-corner-all', // table classes
- header : 'ui-widget-header ui-corner-all ui-state-default', // header classes
- icons : 'ui-icon', // icon class added to the <i> in the header
- sortNone : 'ui-icon-carat-2-n-s',
- sortAsc : 'ui-icon-carat-1-n',
- sortDesc : 'ui-icon-carat-1-s',
- active : 'ui-state-active', // applied when column is sorted
- hover : 'ui-state-hover', // hover class
- filterRow: '',
- even : 'ui-widget-content', // even row zebra striping
- odd : 'ui-state-default' // odd row zebra striping
+ table : 'ui-widget ui-widget-content ui-corner-all', // table classes
+ header : 'ui-widget-header ui-corner-all ui-state-default', // header classes
+ footerRow : '',
+ footerCells: '',
+ icons : 'ui-icon', // icon class added to the <i> in the header
+ sortNone : 'ui-icon-carat-2-n-s',
+ sortAsc : 'ui-icon-carat-1-n',
+ sortDesc : 'ui-icon-carat-1-s',
+ active : 'ui-state-active', // applied when column is sorted
+ hover : 'ui-state-hover', // hover class
+ filterRow : '',
+ even : 'ui-widget-content', // even row zebra striping
+ odd : 'ui-state-default' // odd row zebra striping
});
This widget option replaces the previous widgetUitheme. All theme css names are now contained within the $.tablesorter.themes
variable. Extend the default theme as seen above.
@@ -1991,26 +1993,29 @@ $.extend($.tablesorter.themes.jui, {
Use the "uitheme"
option to change the css class name as follows:
$(function(){
$("table").tablesorter({
- widgets: ["uitheme"], // initialize ui theme styling widget of the table
+ theme : 'jui', // set theme name from $.tablesorter.themes here
+ widgets : ["uitheme"], // initialize ui theme styling widget of the table
widgetOptions: {
- uitheme : "jui"
+ uitheme : "jui" // this is now optional in v2.7, it is overridden by the theme option
}
});
});
To add a new theme, define it as follows; replace "custom" with the name of your theme:
$.tablesorter.themes.custom = {
- table : 'table', // table classes
- header : 'header', // header classes
- icons : 'icon', // icon class added to the <i> in the header
- sortNone : 'sort-none', // unsorted header
- sortAsc : 'sort-asc', // ascending sorted header
- sortDesc : 'sort-desc', // descending sorted header
- active : 'sort-active', // applied when column is sorted
- hover : 'hover', // hover class
- filterRow: 'filters', // class added to the filter row
- even : 'even', // even row zebra striping
- odd : 'odd' // odd row zebra striping
+ table : 'table', // table classes
+ header : 'header', // header classes
+ footerRow : '',
+ footerCells: '',
+ icons : 'icon', // icon class added to the <i> in the header
+ sortNone : 'sort-none', // unsorted header
+ sortAsc : 'sort-asc', // ascending sorted header
+ sortDesc : 'sort-desc', // descending sorted header
+ active : 'sort-active', // applied when column is sorted
+ hover : 'hover', // hover class
+ filterRow : 'filters', // class added to the filter row
+ even : 'even', // even row zebra striping
+ odd : 'odd' // odd row zebra striping
}
Example
diff --git a/docs/themes.html b/docs/themes.html
index 952f5c75..9d145a5c 100644
--- a/docs/themes.html
+++ b/docs/themes.html
@@ -6,7 +6,7 @@