3 * TableSorter 2.0 - Client-side table sorting with ease!
5 * @requires jQuery v1.2.3
7 * Copyright (c) 2007 Christian Bach
8 * Examples and docs at: http://tablesorter.com
9 * Dual licensed under the MIT and GPL licenses:
10 * http://www.opensource.org/licenses/mit-license.php
11 * http://www.gnu.org/licenses/gpl.html
16 * @description Create a sortable table with multi-column sorting capabilitys
18 * @example $('table').tablesorter();
19 * @desc Create a simple tablesorter interface.
21 * @example $('table').tablesorter({ sortList:[[0,0],[1,0]] });
22 * @desc Create a tablesorter interface and sort on the first and secound column in ascending order.
24 * @example $('table').tablesorter({ headers: { 0: { sorter: false}, 1: {sorter: false} } });
25 * @desc Create a tablesorter interface and disableing the first and secound column headers.
27 * @example $('table').tablesorter({ 0: {sorter:"integer"}, 1: {sorter:"currency"} });
28 * @desc Create a tablesorter interface and set a column parser for the first and secound column.
31 * @param Object settings An object literal containing key/value pairs to provide optional settings.
33 * @option String cssHeader (optional) A string of the class name to be appended to sortable tr elements in the thead of the table.
34 * Default value: "header"
36 * @option String cssAsc (optional) A string of the class name to be appended to sortable tr elements in the thead on a ascending sort.
37 * Default value: "headerSortUp"
39 * @option String cssDesc (optional) A string of the class name to be appended to sortable tr elements in the thead on a descending sort.
40 * Default value: "headerSortDown"
42 * @option String sortInitialOrder (optional) A string of the inital sorting order can be asc or desc.
43 * Default value: "asc"
45 * @option String sortMultisortKey (optional) A string of the multi-column sort key.
46 * Default value: "shiftKey"
48 * @option String textExtraction (optional) A string of the text-extraction method to use.
49 * For complex html structures inside td cell set this option to "complex",
50 * on large tables the complex option can be slow.
51 * Default value: "simple"
53 * @option Object headers (optional) An array containing the forces sorting rules.
54 * This option let's you specify a default sorting rule.
57 * @option Array sortList (optional) An array containing the forces sorting rules.
58 * This option let's you specify a default sorting rule.
61 * @option Array sortForce (optional) An array containing forced sorting rules.
62 * This option let's you specify a default sorting rule, which is prepended to user-selected rules.
65 * @option Array sortAppend (optional) An array containing forced sorting rules.
66 * This option let's you specify a default sorting rule, which is appended to user-selected rules.
69 * @option Boolean widthFixed (optional) Boolean flag indicating if tablesorter should apply fixed widths to the table columns.
70 * This is usefull when using the pager companion plugin.
71 * This options requires the dimension jquery plugin.
72 * Default value: false
74 * @option Boolean cancelSelection (optional) Boolean flag indicating if tablesorter should cancel selection of the table headers text.
77 * @option Boolean debug (optional) Boolean flag indicating if tablesorter should display debuging information usefull for development.
83 * @cat Plugins/Tablesorter
85 * @author Christian Bach/christian.bach@polyester.se
90 tablesorter: new function() {
92 var parsers = [], widgets = [];
96 cssAsc: "headerSortUp",
97 cssDesc: "headerSortDown",
98 sortInitialOrder: "asc",
99 sortMultiSortKey: "shiftKey",
102 textExtraction: "simple",
105 widgetZebra: {css: ["even","odd"]},
108 cancelSelection: true,
117 function benchmark(s,d) {
118 log(s + "," + (new Date().getTime() - d.getTime()) + "ms");
121 this.benchmark = benchmark;
124 if (typeof console != "undefined" && typeof console.debug != "undefined") {
132 function buildParserCache(table,$headers) {
134 if(table.config.debug) { var parsersDebug = ""; }
136 var rows = table.tBodies[0].rows;
138 if(table.tBodies[0].rows[0]) {
140 var list = [], cells = rows[0].cells, l = cells.length;
142 for (var i=0;i < l; i++) {
145 if($.metadata && ($($headers[i]).metadata() && $($headers[i]).metadata().sorter) ) {
147 p = getParserById($($headers[i]).metadata().sorter);
149 } else if((table.config.headers[i] && table.config.headers[i].sorter)) {
151 p = getParserById(table.config.headers[i].sorter);
154 p = detectParserForColumn(table,cells[i]);
157 if(table.config.debug) { parsersDebug += "column:" + i + " parser:" +p.id + "\n"; }
163 if(table.config.debug) { log(parsersDebug); }
168 function detectParserForColumn(table,node) {
169 var l = parsers.length;
170 for(var i=1; i < l; i++) {
171 if(parsers[i].is($.trim(getElementText(table.config,node)),table,node)) {
175 // 0 is always the generic parser (text)
179 function getParserById(name) {
180 var l = parsers.length;
181 for(var i=0; i < l; i++) {
182 if(parsers[i].id.toLowerCase() == name.toLowerCase()) {
190 function buildCache(table) {
192 if(table.config.debug) { var cacheTime = new Date(); }
195 var totalRows = (table.tBodies[0] && table.tBodies[0].rows.length) || 0,
196 totalCells = (table.tBodies[0].rows[0] && table.tBodies[0].rows[0].cells.length) || 0,
197 parsers = table.config.parsers,
198 cache = {row: [], normalized: []};
200 for (var i=0;i < totalRows; ++i) {
202 /** Add the table data to main data array */
203 var c = table.tBodies[0].rows[i], cols = [];
205 cache.row.push($(c));
207 for(var j=0; j < totalCells; ++j) {
208 cols.push(parsers[j].format(getElementText(table.config,c.cells[j]),table,c.cells[j]));
211 cols.push(i); // add position for rowCache
212 cache.normalized.push(cols);
216 if(table.config.debug) { benchmark("Building cache for " + totalRows + " rows:", cacheTime); }
221 function getElementText(config,node) {
227 if(config.textExtraction == "simple") {
228 if(node.childNodes[0] && node.childNodes[0].hasChildNodes()) {
229 t = node.childNodes[0].innerHTML;
234 if(typeof(config.textExtraction) == "function") {
235 t = config.textExtraction(node);
243 function appendToTable(table,cache) {
245 if(table.config.debug) {var appendTime = new Date()}
250 totalRows = n.length,
251 checkCell = (n[0].length-1),
252 tableBody = $(table.tBodies[0]),
255 for (var i=0;i < totalRows; i++) {
256 rows.push(r[n[i][checkCell]]);
257 if(!table.config.appender) {
259 var o = r[n[i][checkCell]];
261 for(var j=0; j < l; j++) {
263 tableBody[0].appendChild(o[j]);
267 //tableBody.append(r[n[i][checkCell]]);
271 if(table.config.appender) {
273 table.config.appender(table,rows);
278 if(table.config.debug) { benchmark("Rebuilt table:", appendTime); }
280 //apply table widgets
284 setTimeout(function() {
285 $(table).trigger("sortEnd");
290 function buildHeaders(table) {
292 if(table.config.debug) { var time = new Date(); }
294 var meta = ($.metadata) ? true : false, tableHeadersRows = [];
296 for(var i = 0; i < table.tHead.rows.length; i++) { tableHeadersRows[i]=0; };
298 $tableHeaders = $("thead th",table);
300 $tableHeaders.each(function(index) {
304 this.order = formatSortingOrder(table.config.sortInitialOrder);
306 if(checkHeaderMetadata(this) || checkHeaderOptions(table,index)) this.sortDisabled = true;
308 if(!this.sortDisabled) {
309 $(this).addClass(table.config.cssHeader);
312 // add cell to headerList
313 table.config.headerList[index]= this;
316 if(table.config.debug) { benchmark("Built headers:", time); log($tableHeaders); }
318 return $tableHeaders;
322 function checkCellColSpan(table, rows, row) {
323 var arr = [], r = table.tHead.rows, c = r[row].cells;
325 for(var i=0; i < c.length; i++) {
328 if ( cell.colSpan > 1) {
329 arr = arr.concat(checkCellColSpan(table, headerArr,row++));
331 if(table.tHead.length == 1 || (cell.rowSpan > 1 || !r[row+1])) {
334 //headerArr[row] = (i+row);
340 function checkHeaderMetadata(cell) {
341 if(($.metadata) && ($(cell).metadata().sorter === false)) { return true; };
345 function checkHeaderOptions(table,i) {
346 if((table.config.headers[i]) && (table.config.headers[i].sorter === false)) { return true; };
350 function applyWidget(table) {
351 var c = table.config.widgets;
353 for(var i=0; i < l; i++) {
355 getWidgetById(c[i]).format(table);
360 function getWidgetById(name) {
361 var l = widgets.length;
362 for(var i=0; i < l; i++) {
363 if(widgets[i].id.toLowerCase() == name.toLowerCase() ) {
369 function formatSortingOrder(v) {
371 if(typeof(v) != "Number") {
372 i = (v.toLowerCase() == "desc") ? 1 : 0;
374 i = (v == (0 || 1)) ? v : 0;
379 function isValueInArray(v, a) {
381 for(var i=0; i < l; i++) {
389 function setHeadersCss(table,$headers, list, css) {
390 // remove all header information
391 $headers.removeClass(css[0]).removeClass(css[1]);
394 $headers.each(function(offset) {
395 if(!this.sortDisabled) {
396 h[this.column] = $(this);
401 for(var i=0; i < l; i++) {
402 h[list[i][0]].addClass(css[list[i][1]]);
406 function fixColumnWidth(table,$headers) {
407 var c = table.config;
409 var colgroup = $('<colgroup>');
410 $("tr:first td",table.tBodies[0]).each(function() {
411 colgroup.append($('<col>').css('width',$(this).width()));
413 $(table).prepend(colgroup);
417 function updateHeaderSortCount(table,sortList) {
418 var c = table.config, l = sortList.length;
419 for(var i=0; i < l; i++) {
420 var s = sortList[i], o = c.headerList[s[0]];
426 /* sorting methods */
427 function multisort(table,sortList,cache) {
429 if(table.config.debug) { var sortTime = new Date(); }
431 var dynamicExp = "var sortWrapper = function(a,b) {", l = sortList.length;
433 for(var i=0; i < l; i++) {
435 var c = sortList[i][0];
436 var order = sortList[i][1];
437 var s = (getCachedSortType(table.config.parsers,c) == "text") ? ((order == 0) ? "sortText" : "sortTextDesc") : ((order == 0) ? "sortNumeric" : "sortNumericDesc");
441 dynamicExp += "var " + e + " = " + s + "(a[" + c + "],b[" + c + "]); ";
442 dynamicExp += "if(" + e + ") { return " + e + "; } ";
443 dynamicExp += "else { ";
446 // if value is the same keep orignal order
447 var orgOrderCol = cache.normalized[0].length - 1;
448 dynamicExp += "return a[" + orgOrderCol + "]-b[" + orgOrderCol + "];";
450 for(var i=0; i < l; i++) {
454 dynamicExp += "return 0; ";
459 cache.normalized.sort(sortWrapper);
461 if(table.config.debug) { benchmark("Sorting on " + sortList.toString() + " and dir " + order+ " time:", sortTime); }
466 function sortText(a,b) {
467 return ((a < b) ? -1 : ((a > b) ? 1 : 0));
470 function sortTextDesc(a,b) {
471 return ((b < a) ? -1 : ((b > a) ? 1 : 0));
474 function sortNumeric(a,b) {
478 function sortNumericDesc(a,b) {
482 function getCachedSortType(parsers,i) {
483 return parsers[i].type;
487 this.construct = function(settings) {
489 return this.each(function() {
491 if(!this.tHead || !this.tBodies) return;
493 var $this, $document,$headers, cache, config, shiftDown = 0, sortOrder;
497 config = $.extend(this.config, $.tablesorter.defaults, settings);
499 // store common expression for speed
503 $headers = buildHeaders(this);
505 // try to auto detect column type, and store in tables config
506 this.config.parsers = buildParserCache(this,$headers);
509 // build the cache for the tbody cells
510 cache = buildCache(this);
512 // get the css class names, could be done else where.
513 var sortCSS = [config.cssDesc,config.cssAsc];
515 // fixate columns if the users supplies the fixedWidth option
516 fixColumnWidth(this);
518 // apply event handling to headers
519 // this is to big, perhaps break it out?
520 $headers.click(function(e) {
522 $this.trigger("sortStart");
524 var totalRows = ($this[0].tBodies[0] && $this[0].tBodies[0].rows.length) || 0;
526 if(!this.sortDisabled && totalRows > 0) {
529 // store exp, for speed
532 // get current column index
535 // get current column sort order
536 this.order = this.count++ % 2;
538 // user only whants to sort on one column
539 if(!e[config.sortMultiSortKey]) {
541 // flush the sort list
542 config.sortList = [];
544 if(config.sortForce != null) {
545 var a = config.sortForce;
546 for(var j=0; j < a.length; j++) {
548 config.sortList.push(a[j]);
553 // add column to sort list
554 config.sortList.push([i,this.order]);
556 // multi column sorting
558 // the user has clicked on an all ready sortet column.
559 if(isValueInArray(i,config.sortList)) {
561 // revers the sorting direction for all tables.
562 for(var j=0; j < config.sortList.length; j++) {
563 var s = config.sortList[j], o = config.headerList[s[0]];
571 // add column to sort list array
572 config.sortList.push([i,this.order]);
575 setTimeout(function() {
576 //set css for headers
577 setHeadersCss($this[0],$headers,config.sortList,sortCSS);
578 appendToTable($this[0],multisort($this[0],config.sortList,cache));
580 // stop normal event by returning false
584 }).mousedown(function() {
585 if(config.cancelSelection) {
586 this.onselectstart = function() {return false};
591 // apply easy methods that trigger binded events
592 $this.bind("update",function() {
595 this.config.parsers = buildParserCache(this,$headers);
597 // rebuild the cache map
598 cache = buildCache(this);
600 }).bind("sorton",function(e,list) {
602 $(this).trigger("sortStart");
604 config.sortList = list;
606 // update and store the sortlist
607 var sortList = config.sortList;
609 // update header count index
610 updateHeaderSortCount(this,sortList);
612 //set css for headers
613 setHeadersCss(this,$headers,sortList,sortCSS);
616 // sort the table and append it to the dom
617 appendToTable(this,multisort(this,sortList,cache));
619 }).bind("appendCache",function() {
621 appendToTable(this,cache);
623 }).bind("applyWidgetId",function(e,id) {
625 getWidgetById(id).format(this);
627 }).bind("applyWidgets",function() {
632 if($.metadata && ($(this).metadata() && $(this).metadata().sortlist)) {
633 config.sortList = $(this).metadata().sortlist;
635 // if user has supplied a sort list to constructor.
636 if(config.sortList.length > 0) {
637 $this.trigger("sorton",[config.sortList]);
645 this.addParser = function(parser) {
646 var l = parsers.length, a = true;
647 for(var i=0; i < l; i++) {
648 if(parsers[i].id.toLowerCase() == parser.id.toLowerCase()) {
652 if(a) { parsers.push(parser); };
655 this.addWidget = function(widget) {
656 widgets.push(widget);
659 this.formatFloat = function(s) {
660 var i = parseFloat(s);
661 return (isNaN(i)) ? 0 : i;
663 this.formatInt = function(s) {
665 return (isNaN(i)) ? 0 : i;
668 this.isDigit = function(s,config) {
669 var DECIMAL = '\\' + config.decimal;
670 var exp = '/(^[+]?0(' + DECIMAL +'0+)?$)|(^([-+]?[1-9][0-9]*)$)|(^([-+]?((0?|[1-9][0-9]*)' + DECIMAL +'(0*[1-9][0-9]*)))$)|(^[-+]?[1-9]+[0-9]*' + DECIMAL +'0+$)/';
671 return RegExp(exp).test($.trim(s));
674 this.clearTableBody = function(table) {
677 while ( this.firstChild ) this.removeChild( this.firstChild );
679 empty.apply(table.tBodies[0]);
681 table.tBodies[0].innerHTML = "";
687 // extend plugin scope
689 tablesorter: $.tablesorter.construct
692 var ts = $.tablesorter;
694 // add default parsers
700 format: function(s) {
701 return $.trim(s.toLowerCase());
708 is: function(s,table) {
709 var c = table.config;
710 return $.tablesorter.isDigit(s,c);
712 format: function(s) {
713 return $.tablesorter.formatFloat(s);
721 return /^[£$€?.]/.test(s);
723 format: function(s) {
724 return $.tablesorter.formatFloat(s.replace(new RegExp(/[^0-9.]/g),""));
732 return /^\d{2,3}[\.]\d{2,3}[\.]\d{2,3}[\.]\d{2,3}$/.test(s);
734 format: function(s) {
735 var a = s.split("."), r = "", l = a.length;
736 for(var i = 0; i < l; i++) {
738 if(item.length == 2) {
744 return $.tablesorter.formatFloat(r);
752 return /^(https?|ftp|file):\/\/$/.test(s);
754 format: function(s) {
755 return jQuery.trim(s.replace(new RegExp(/(https?|ftp|file):\/\//),''));
763 return /^\d{4}[\/-]\d{1,2}[\/-]\d{1,2}$/.test(s);
765 format: function(s) {
766 return $.tablesorter.formatFloat((s != "") ? new Date(s.replace(new RegExp(/-/g),"/")).getTime() : "0");
774 return /\%$/.test($.trim(s));
776 format: function(s) {
777 return $.tablesorter.formatFloat(s.replace(new RegExp(/%/g),""));
785 return s.match(new RegExp(/^[A-Za-z]{3,10}\.? [0-9]{1,2}, ([0-9]{4}|'?[0-9]{2}) (([0-2]?[0-9]:[0-5][0-9])|([0-1]?[0-9]:[0-5][0-9]\s(AM|PM)))$/));
787 format: function(s) {
788 return $.tablesorter.formatFloat(new Date(s).getTime());
796 return /\d{1,2}[\/\-]\d{1,2}[\/\-]\d{2,4}/.test(s);
798 format: function(s,table) {
799 var c = table.config;
800 s = s.replace(/\-/g,"/");
801 if(c.dateFormat == "us") {
802 // reformat the string in ISO format
803 s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$1/$2");
804 } else if(c.dateFormat == "uk") {
805 //reformat the string in ISO format
806 s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{4})/, "$3/$2/$1");
807 } else if(c.dateFormat == "dd/mm/yy" || c.dateFormat == "dd-mm-yy") {
808 s = s.replace(/(\d{1,2})[\/\-](\d{1,2})[\/\-](\d{2})/, "$1/$2/$3");
810 return $.tablesorter.formatFloat(new Date(s).getTime());
818 return /^(([0-2]?[0-9]:[0-5][0-9])|([0-1]?[0-9]:[0-5][0-9]\s(am|pm)))$/.test(s);
820 format: function(s) {
821 return $.tablesorter.formatFloat(new Date("2000/01/01 " + s).getTime());
832 format: function(s,table,cell) {
833 var c = table.config, p = (!c.parserMetadataName) ? 'sortValue' : c.parserMetadataName;
834 return $(cell).metadata()[p];
839 // add default widgets
842 format: function(table) {
843 if(table.config.debug) { var time = new Date(); }
844 $("tr:visible",table.tBodies[0])
846 .removeClass(table.config.widgetZebra.css[1]).addClass(table.config.widgetZebra.css[0])
847 .end().filter(':odd')
848 .removeClass(table.config.widgetZebra.css[0]).addClass(table.config.widgetZebra.css[1]);
849 if(table.config.debug) { $.tablesorter.benchmark("Applying Zebra widget", time); }