tablesort.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. /*
  2. A simple, lightweight jQuery plugin for creating sortable tables.
  3. https://github.com/kylefox/jquery-tablesort
  4. Version 0.0.11
  5. */
  6. (function($) {
  7. $.tablesort = function ($table, settings) {
  8. var self = this;
  9. this.$table = $table;
  10. this.$thead = this.$table.find('thead');
  11. this.settings = $.extend({}, $.tablesort.defaults, settings);
  12. this.$sortCells = this.$thead.length > 0 ? this.$thead.find('th:not(.no-sort)') : this.$table.find('th:not(.no-sort)');
  13. this.$sortCells.on('click.tablesort', function() {
  14. self.sort($(this));
  15. });
  16. this.index = null;
  17. this.$th = null;
  18. this.direction = null;
  19. };
  20. $.tablesort.prototype = {
  21. sort: function(th, direction) {
  22. var start = new Date(),
  23. self = this,
  24. table = this.$table,
  25. rowsContainer = table.find('tbody').length > 0 ? table.find('tbody') : table,
  26. rows = rowsContainer.find('tr').has('td, th'),
  27. cells = rows.find(':nth-child(' + (th.index() + 1) + ')').filter('td, th'),
  28. sortBy = th.data().sortBy,
  29. sortedMap = [];
  30. var unsortedValues = cells.map(function(idx, cell) {
  31. if (sortBy)
  32. return (typeof sortBy === 'function') ? sortBy($(th), $(cell), self) : sortBy;
  33. return ($(this).data().sortValue != null ? $(this).data().sortValue : $(this).text());
  34. });
  35. if (unsortedValues.length === 0) return;
  36. //click on a different column
  37. if (this.index !== th.index()) {
  38. this.direction = 'asc';
  39. this.index = th.index();
  40. }
  41. else if (direction !== 'asc' && direction !== 'desc')
  42. this.direction = this.direction === 'asc' ? 'desc' : 'asc';
  43. else
  44. this.direction = direction;
  45. direction = this.direction == 'asc' ? 1 : -1;
  46. self.$table.trigger('tablesort:start', [self]);
  47. self.log("Sorting by " + this.index + ' ' + this.direction);
  48. // Try to force a browser redraw
  49. self.$table.css("display");
  50. // Run sorting asynchronously on a timeout to force browser redraw after
  51. // `tablesort:start` callback. Also avoids locking up the browser too much.
  52. setTimeout(function() {
  53. self.$sortCells.removeClass(self.settings.asc + ' ' + self.settings.desc);
  54. for (var i = 0, length = unsortedValues.length; i < length; i++)
  55. {
  56. sortedMap.push({
  57. index: i,
  58. cell: cells[i],
  59. row: rows[i],
  60. value: unsortedValues[i]
  61. });
  62. }
  63. sortedMap.sort(function(a, b) {
  64. return self.settings.compare(a.value, b.value) * direction;
  65. });
  66. $.each(sortedMap, function(i, entry) {
  67. rowsContainer.append(entry.row);
  68. });
  69. th.addClass(self.settings[self.direction]);
  70. self.log('Sort finished in ' + ((new Date()).getTime() - start.getTime()) + 'ms');
  71. self.$table.trigger('tablesort:complete', [self]);
  72. //Try to force a browser redraw
  73. self.$table.css("display");
  74. }, unsortedValues.length > 2000 ? 200 : 10);
  75. },
  76. log: function(msg) {
  77. if(($.tablesort.DEBUG || this.settings.debug) && console && console.log) {
  78. console.log('[tablesort] ' + msg);
  79. }
  80. },
  81. destroy: function() {
  82. this.$sortCells.off('click.tablesort');
  83. this.$table.data('tablesort', null);
  84. return null;
  85. }
  86. };
  87. $.tablesort.DEBUG = false;
  88. $.tablesort.defaults = {
  89. debug: $.tablesort.DEBUG,
  90. asc: 'sorted ascending',
  91. desc: 'sorted descending',
  92. compare: function(a, b) {
  93. if (!isNaN(parseInt(a.trim())) && !isNaN(parseInt(b.trim())) ){
  94. a = parseInt(a);
  95. b = parseInt(b);
  96. }
  97. if (a > b) {
  98. return 1;
  99. } else if (a < b) {
  100. return -1;
  101. } else {
  102. return 0;
  103. }
  104. }
  105. };
  106. $.fn.tablesort = function(settings) {
  107. var table, sortable, previous;
  108. return this.each(function() {
  109. table = $(this);
  110. previous = table.data('tablesort');
  111. if(previous) {
  112. previous.destroy();
  113. }
  114. table.data('tablesort', new $.tablesort(table, settings));
  115. });
  116. };
  117. })(window.Zepto || window.jQuery);