addRows method & destroy pager

This commit is contained in:
Rob Garrison 2011-09-08 11:28:10 -05:00
parent 72f621306b
commit 1153c05171
25 changed files with 345 additions and 41 deletions

View File

@ -28,6 +28,14 @@ Included all original [document pages](http://mottie.github.com/tablesorter/docs
View the [complete listing here](http://mottie.github.com/tablesorter/changelog.txt).
#### Version 2.0.16 (2011-09-08)
* Added notes to demo pages to indicate if the original (version 2.0.5, at [tablesorter.com](http://tablesorter.com/docs/)) does have that option or method.
* Added "addRows" method that allows adding table rows.
* This method differs from the "update" method in that it only adds rows to the cache.
* Use this new method to add rows to a table with the pager plugin applied. Using the "update" method on a table with the pager plugin will remove all hidden rows from the cache.
* Added a "destroy.pager" method to remove the pager from the table - pager demo updated.
#### Version 2.0.15 (2011-08-23)
* Fixed a problem that caused a javascript error when a table header cell doesn't have a class name.

View File

@ -1,12 +1,29 @@
/*
* tablesorter pager plugin
* updated 7/27/2011
* updated 9/8/2011
*/
(function($) {
$.extend({tablesorterPager: new function() {
var updatePageDisplay = function(table,c) {
// hide arrows at extremes
var pagerArrows = function(c) {
if (c.updateArrows) {
c.container.removeClass(c.cssDisabled);
$(c.cssFirst + ',' + c.cssPrev + ',' + c.cssNext + ',' + c.cssLast, c.container).removeClass(c.cssDisabled);
if (c.page === 0) {
$(c.cssFirst + ',' + c.cssPrev, c.container).addClass(c.cssDisabled);
} else if (c.page === c.totalPages - 1) {
$(c.cssNext + ',' + c.cssLast, c.container).addClass(c.cssDisabled);
}
// if the total # of pages is less than the selected number of visible rows, then hide the pager
if (c.totalRows < c.size) {
c.container.addClass(c.cssDisabled);
}
}
},
updatePageDisplay = function(table,c) {
c.startRow = c.size * (c.page) + 1;
c.endRow = Math.min(c.totalRows, c.size * (c.page+1));
var out = $(c.cssPageDisplay, c.container),
@ -25,6 +42,7 @@
} else {
out.html(s);
}
pagerArrows(c);
$(table).trigger('pagerComplete', c);
},
@ -71,29 +89,11 @@
updatePageDisplay(table,c);
},
// hide arrows at extremes
pagerArrows = function(c) {
if (c.updateArrows) {
c.container.removeClass(c.cssDisabled);
$(c.cssFirst + ',' + c.cssPrev + ',' + c.cssNext + ',' + c.cssLast, c.container).removeClass(c.cssDisabled);
if (c.page === 0) {
$(c.cssFirst + ',' + c.cssPrev, c.container).addClass(c.cssDisabled);
} else if (c.page === c.totalPages - 1) {
$(c.cssNext + ',' + c.cssLast, c.container).addClass(c.cssDisabled);
}
// if the total # of pages is less than the selected number of visible rows, then hide the pager
if (c.totalRows < c.size) {
c.container.addClass(c.cssDisabled);
}
}
},
moveToPage = function(table) {
var c = table.config;
if (c.page < 0 || c.page > (c.totalPages-1)) {
c.page = 0;
}
pagerArrows(c);
renderTable(table,c.rowsCopy);
},
@ -134,6 +134,18 @@
c.page = 0;
}
moveToPage(table);
},
destroyPager = function(table){
var c = table.config;
c.size = c.totalRows;
c.totalPages = 1;
renderTable(table,c.rowsCopy);
// hide pager
c.container.hide();
c.appender = null;
$(table).unbind('destroy.pager');
};
this.appender = function(table,rows) {
@ -195,6 +207,10 @@
return false;
});
$(this).bind('destroy.pager', function(){
destroyPager(table);
});
});
};

View File

@ -1,2 +1,2 @@
/* tablesorter pager plugin */
(function(d){d.extend({tablesorterPager:new function(){var o=function(a,b){b.startRow=b.size*b.page+1;b.endRow=Math.min(b.totalRows,b.size*(b.page+1));var c=d(b.cssPageDisplay,b.container),e=b.output.replace(/\{(page|totalPages|startRow|endRow|totalRows)\}/gi,function(a){return{"{page}":b.page+1,"{totalPages}":b.totalPages,"{startRow}":b.startRow,"{endRow}":b.endRow,"{totalRows}":b.totalRows}[a]});c[0].tagName==="INPUT"?c.val(e):c.html(e);d(a).trigger("pagerComplete",b)},k=function(a){var b=a.config, a=d(a);if(!b.pagerPositionSet&&b.positionFixed)a.offset&&b.container.css({top:a.offset().top+a.height()+"px",position:"absolute"}),b.pagerPositionSet=!0},m=function(a,b){var c,e,h,i,g=a.config,f=b.length;c=g.page*g.size;var j=c+g.size;d(a).trigger("pagerChange",g);if(j>b.length)j=b.length;i=d(a.tBodies[0]);for(d.tablesorter.clearTableBody(a);c<j;c++){h=b[c];f=h.length;for(e=0;e<f;e++)i[0].appendChild(h[e])}k(a,i);d(a).trigger("applyWidgets");g.page>=g.totalPages&&l(a);o(a,g)},n=function(a){a.updateArrows&& (a.container.removeClass(a.cssDisabled),d(a.cssFirst+","+a.cssPrev+","+a.cssNext+","+a.cssLast,a.container).removeClass(a.cssDisabled),a.page===0?d(a.cssFirst+","+a.cssPrev,a.container).addClass(a.cssDisabled):a.page===a.totalPages-1&&d(a.cssNext+","+a.cssLast,a.container).addClass(a.cssDisabled),a.totalRows<a.size&&a.container.addClass(a.cssDisabled))},f=function(a){var b=a.config;if(b.page<0||b.page>b.totalPages-1)b.page=0;n(b);m(a,b.rowsCopy)},l=function(a){var b=a.config;b.page=b.totalPages-1; f(a)};this.appender=function(a,b){var c=a.config;c.rowsCopy=b;c.totalRows=b.length;c.totalPages=Math.ceil(c.totalRows/c.size);m(a,b)};this.defaults={size:10,offset:0,page:0,totalRows:0,totalPages:0,container:null,cssNext:".next",cssPrev:".prev",cssFirst:".first",cssLast:".last",cssPageDisplay:".pagedisplay",cssPageSize:".pagesize",cssDisabled:"disabled",output:"{page}/{totalPages}",updateArrows:!1,positionFixed:!0,appender:this.appender};this.construct=function(a){return this.each(function(){var b= d.extend(this.config,d.tablesorterPager.defaults,a),c=this,e=b.container;d(this).trigger("appendCache");b.size=parseInt(d(".pagesize",e).val(),10);n(b);d(b.cssFirst,e).click(function(){c.config.page=0;f(c);return!1});d(b.cssNext,e).click(function(){var a=c.config;a.page++;if(a.page>=a.totalPages-1)a.page=a.totalPages-1;f(c);return!1});d(b.cssPrev,e).click(function(){var a=c.config;a.page--;if(a.page<=0)a.page=0;f(c);return!1});d(b.cssLast,e).click(function(){l(c);return!1});d(b.cssPageSize,e).change(function(){var a= parseInt(d(this).val(),10),b=c.config;b.size=a;b.totalPages=Math.ceil(b.totalRows/b.size);b.pagerPositionSet=!1;f(c);k(c);return!1})})}}});d.fn.extend({tablesorterPager:d.tablesorterPager.construct})})(jQuery);
(function(d){d.extend({tablesorterPager:new function(){var k=function(a){a.updateArrows&&(a.container.removeClass(a.cssDisabled),d(a.cssFirst+","+a.cssPrev+","+a.cssNext+","+a.cssLast,a.container).removeClass(a.cssDisabled),a.page===0?d(a.cssFirst+","+a.cssPrev,a.container).addClass(a.cssDisabled):a.page===a.totalPages-1&&d(a.cssNext+","+a.cssLast,a.container).addClass(a.cssDisabled),a.totalRows<a.size&&a.container.addClass(a.cssDisabled))},n=function(a,b){b.startRow=b.size*b.page+1;b.endRow=Math.min(b.totalRows, b.size*(b.page+1));var c=d(b.cssPageDisplay,b.container),e=b.output.replace(/\{(page|totalPages|startRow|endRow|totalRows)\}/gi,function(a){return{"{page}":b.page+1,"{totalPages}":b.totalPages,"{startRow}":b.startRow,"{endRow}":b.endRow,"{totalRows}":b.totalRows}[a]});c[0].tagName==="INPUT"?c.val(e):c.html(e);k(b);d(a).trigger("pagerComplete",b)},l=function(a){var b=a.config,a=d(a);if(!b.pagerPositionSet&&b.positionFixed)a.offset&&b.container.css({top:a.offset().top+a.height()+"px",position:"absolute"}), b.pagerPositionSet=!0},h=function(a,b){var c,e,i,j,g=a.config,f=b.length;c=g.page*g.size;var h=c+g.size;d(a).trigger("pagerChange",g);if(h>b.length)h=b.length;j=d(a.tBodies[0]);for(d.tablesorter.clearTableBody(a);c<h;c++){i=b[c];f=i.length;for(e=0;e<f;e++)j[0].appendChild(i[e])}l(a,j);d(a).trigger("applyWidgets");g.page>=g.totalPages&&m(a);n(a,g)},f=function(a){var b=a.config;if(b.page<0||b.page>b.totalPages-1)b.page=0;h(a,b.rowsCopy)},m=function(a){var b=a.config;b.page=b.totalPages-1;f(a)};this.appender= function(a,b){var c=a.config;c.rowsCopy=b;c.totalRows=b.length;c.totalPages=Math.ceil(c.totalRows/c.size);h(a,b)};this.defaults={size:10,offset:0,page:0,totalRows:0,totalPages:0,container:null,cssNext:".next",cssPrev:".prev",cssFirst:".first",cssLast:".last",cssPageDisplay:".pagedisplay",cssPageSize:".pagesize",cssDisabled:"disabled",output:"{page}/{totalPages}",updateArrows:!1,positionFixed:!0,appender:this.appender};this.construct=function(a){return this.each(function(){var b=d.extend(this.config, d.tablesorterPager.defaults,a),c=this,e=b.container;d(this).trigger("appendCache");b.size=parseInt(d(".pagesize",e).val(),10);k(b);d(b.cssFirst,e).click(function(){c.config.page=0;f(c);return!1});d(b.cssNext,e).click(function(){var a=c.config;a.page++;if(a.page>=a.totalPages-1)a.page=a.totalPages-1;f(c);return!1});d(b.cssPrev,e).click(function(){var a=c.config;a.page--;if(a.page<=0)a.page=0;f(c);return!1});d(b.cssLast,e).click(function(){m(c);return!1});d(b.cssPageSize,e).change(function(){var a= parseInt(d(this).val(),10),b=c.config;b.size=a;b.totalPages=Math.ceil(b.totalRows/b.size);b.pagerPositionSet=!1;f(c);l(c);return!1});d(this).bind("destroy.pager",function(){var a=c.config;a.size=a.totalRows;a.totalPages=1;h(c,a.rowsCopy);a.container.hide();a.appender=null;d(c).unbind("destroy.pager")})})}}});d.fn.extend({tablesorterPager:d.tablesorterPager.construct})})(jQuery);

View File

@ -1,5 +1,14 @@
TableSorter Change Log
Version 2.0.16 (2011-09-08)
============================
* Added notes to demo pages to indicate if the original (version 2.0.5, at [tablesorter.com](http://tablesorter.com/docs/)) does have that option or method.
* Added "addRows" method that allows adding table rows.
* This method differs from the "update" method in that it only adds rows to the cache.
* Use this new method to add rows to a table with the pager plugin applied. Using the "update" method on a table with the pager plugin will remove all hidden rows from the cache.
* Added a "destroy.pager" method to remove the pager from the table - pager demo updated.
Version 2.0.15 (2011-08-23)
============================

View File

@ -24,7 +24,7 @@ pre.normal{background-color:transparent;border:none;border-left-width:0;overflow
hr{height:1px;}
code{font-size:108%;font-style:normal;padding:0;}
ul{color:#333;list-style:square;}
#banner{margin:20px;padding-bottom:10px;text-align:left;}
#banner{margin:20px 20px 5px 20px;padding:0;text-align:left;}
#banner *{color:#232121;font-family:Georgia, Palatino, Times New Roman;font-size:30px;font-style:normal;font-weight:400;margin:0;padding:0;}
#banner h1{display:block;float:left;}
#banner h1 em{color:#6cf;}

140
docs/example-add-rows.html Normal file
View File

@ -0,0 +1,140 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery plugin: Tablesorter 2.0 - Adding a table row</title>
<!-- jQuery -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
<!-- Demo stuff -->
<link rel="stylesheet" href="css/jq.css">
<script src="js/chili/jquery.chili-2.2.js"></script>
<script src="js/chili/recipes.js"></script>
<script src="js/docs.js"></script>
<!-- Tablesorter: required -->
<link rel="stylesheet" href="../css/blue/style.css">
<script src="../js/jquery.tablesorter.js"></script>
<style>
.discount { cursor: pointer; }
</style>
<script id="js">$(function() {
$("table").tablesorter({ sortList: [[3,1],[0,0]] });
// Add two new rows using the "addRows" method
// the "update" method doesn't work here because not all
// rows are present in the table when the pager is applied
$('button').click(function(){
// add two rows
var row = '<tr><td>Frank</td><td>Smith</td><td>53</td><td>$39.95</td><td>22%</td><td>Mar 22, 2011 9:33 AM</td></tr>' +
'<tr><td>Inigo</td><td>Montoya</td><td>34</td><td>$19.99</td><td>15%</td><td>Sep 25, 1987 12:00PM</td></tr>',
$row = $(row);
$('table')
.find('tbody').append($row)
.trigger('addRows', [$row]);
});
});</script>
</head>
<body>
<div id="banner">
<h1>table<em>sorter</em></h1>
<h2>Adding table rows</h2>
<h3>Flexible client-side table sorting</h3>
<a href="index.html">Back to documentation</a>
</div>
<div id="main">
<p class="tip">
<em>NOTE!</em>
<ul>
<li>Click on the [ Add Rows ] button to add two new rows.</li>
<li>The "addRows" method was added in version 2.0.16, and is not part of the original plugin.</li>
<li>This example could have used the "update" method to add rows, but to remove rows only the "update" method works.</li>
<li>This method is better used for the <a href="example-pager.html">pager plugin</a> when not all of the rows are displayed.</li>
</ul>
</p>
<h1>Demo</h1>
<br>
<button>Add Rows</button>
<br>
<div id="demo"><table class="tablesorter">
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Age</th>
<th>Total</th>
<th>Discount</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<tr>
<td>Peter</td>
<td>Parker</td>
<td>28</td>
<td class="discount">$9.99</td>
<td>20%</td>
<td>Jul 6, 2006 8:14 AM</td>
</tr>
<tr>
<td>John</td>
<td>Hood</td>
<td>33</td>
<td class="discount">$19.99</td>
<td>25%</td>
<td>Dec 10, 2002 5:14 AM</td>
</tr>
<tr>
<td>Clark</td>
<td>Kent</td>
<td>18</td>
<td class="discount">$15.89</td>
<td>44%</td>
<td>Jan 12, 2003 11:14 AM</td>
</tr>
<tr>
<td>Bruce</td>
<td>Almighty</td>
<td>45</td>
<td class="discount">$153.19</td>
<td>44%</td>
<td>Jan 18, 2001 9:12 AM</td>
</tr>
<tr>
<td>Bruce</td>
<td>Evans</td>
<td>22</td>
<td class="discount">$13.19</td>
<td>11%</td>
<td>Jan 18, 2007 9:12 AM</td>
</tr>
</tbody>
</table></div>
<h1>Javascript</h1>
<div id="javascript">
<pre class="js"></pre>
</div>
<h1>HTML</h1>
<div id="html">
<pre class="html"></pre>
</div>
<div class="next-up">
<hr />
Next up: <a href="example-update-cell.html">Advanced: Update the table after cell content has changed &rsaquo;&rsaquo;</a>
</div>
</div>
</body>
</html>

View File

@ -125,7 +125,7 @@
<div class="next-up">
<hr />
Next up: <a href="example-update-cell.html">Advanced: Update the table after cell content has changed &rsaquo;&rsaquo;</a>
Next up: <a href="example-add-rows.html">Advanced: Adding a table row &rsaquo;&rsaquo;</a>
</div>
</div>

View File

@ -46,7 +46,7 @@
<div id="main">
<p class="tip">
<em>NOTE!</em> Click on [ Apply Widget Id ], then sort the table a few times... then click on [ Apply Widgets ] and sort again.
<em>NOTE!</em> Click on [ Apply Widget Id ], then sort the table a few times... then click on [ Apply Widgets ] and sort again (these methods <strong>are</strong> part of the original plugin).
</p>
<h1>Demo</h1>

View File

@ -62,7 +62,7 @@
<p class="tip">
<em>NOTE!</em> Click the link in the Order # column to reveal the hidden child row cells
(<a href="http://www.pengoworks.com/workshop/jquery/tablesorter/tablesorter.htm">original demo</a>).
(<a href="http://www.pengoworks.com/workshop/jquery/tablesorter/tablesorter.htm">original demo</a>). This option is available in the original plugin.
</p>
<h1>Demo</h1>

View File

@ -33,8 +33,8 @@
// append new html to table body
$("table tbody").append(html);
// let the plugin know that we made a update, then
// set sorting column and direction, this will sort on the first and third column
// let the plugin know that we made a update, then the plugin will
// automatically sort the table based on the header settings
$("table").trigger("update");
return false;
@ -52,6 +52,11 @@
</div>
<div id="main">
<p class="tip">
<em>NOTE!</em> The presorting of an empty table and automatic sorting of appended data was added in version 2.0.14 (not part of the original plugin).
</p>
<h1>Demo</h1>
<div id="demo"><table class="tablesorter">
<thead>

View File

@ -32,7 +32,7 @@
<div id="main">
<p class="tip">
<em>NOTE!</em> Click on any column header to sort that column. Note the new alphanumeric sort working in the first column.
<em>NOTE!</em> Click on any column header to sort that column. The alphanumeric sort working in the first column was added in version 2.0.6 (not part of the original plugin).
</p>
<h1>Demo</h1>

View File

@ -52,6 +52,11 @@
</div>
<div id="main">
<p class="tip">
<em>NOTE!</em> The span wrapping the header text and the index variable for the function was added in version 2.0.9 (it is not part of the original plugin, but the "onRenderHeader" option was available).
</p>
<h1>Demo</h1>
<div id="demo"><table class="tablesorter">
<thead>

View File

@ -40,7 +40,11 @@
<div id="main">
<p class="tip">
<em>NOTE!</em> Click to sort any column header to see the the first column sort is appended to the selected sort order.
<em>NOTE!</em>
<ul>
<li>Click to sort any column header to see the the first column sort is appended to the selected sort order.</li>
<li>This option is part of the original plugin</li>
</ul>
</p>
<h1>Demo</h1>

View File

@ -56,7 +56,11 @@
<div id="main">
<p class="tip">
<em>NOTE!</em> The "First Name" column is sorting by the contents of the &lt;strong&gt; tag (in red).
<em>NOTE!</em>
<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>
</ul>
</p>
<h1>Demo</h1>

View File

@ -45,6 +45,7 @@
<p class="tip">
<em>NOTE!</em>
<ul>
<li>This functionality is new as of version 2.0.10 (not part of the original plugin).</li>
<li>When a column is sorted numerically ( sorter:"digit" ) any text in that column will, by default, be given a <em>zero</em> value. Sort the last column (#9) to see the problem with this method.</li>
<li>Set the headers option "string" value to "max+" to treat any text in that column as a value greater than the <em>max positive</em> value.</li>
<li>Set the headers option "string" value to "max-" to treat any text in that column as a value greater than the <em>max negative</em> value.</li>

View File

@ -43,7 +43,8 @@
<div id="main">
<p class="tip">
<em>TIP!</em> Sort the first and third columns to see how the sort is locked. Override this by using the multisort key (shift) while clicking on the header.
<em>TIP!</em> Sort the first and third columns to see how the sort is locked. Override this by using the multisort key (shift) while clicking on the header.<br>
<em>NOTE!</em> This option was part of the original plugin, but it was broken.
</p>

View File

@ -42,6 +42,11 @@
<a href="index.html">Back to documentation</a>
</div>
<div id="main">
<p class="tip">
<em>NOTE!</em> The functionality to add a "sortInitialOrder" inside of the "headers" option was added in version 2.0.8 (not part of the original plugin).
</p>
<h1>Demo</h1>
<div id="demo"><table class="tablesorter">
<thead>

File diff suppressed because one or more lines are too long

View File

@ -29,6 +29,11 @@
<a href="index.html">Back to documentation</a>
</div>
<div id="main">
<p class="tip">
<em>NOTE!</em> This functionality was added in version 2.0.11 (it is not part of the original plugin).
</p>
<h1>Demo</h1>
<div id="demo"><table class="tablesorter">
<thead>

View File

@ -56,6 +56,11 @@ $(function() {
</div>
<div id="main">
<p class="tip">
<em>NOTE!</em> Assigning the parser using a class name was added in version 2.0.11 (it is not part of the original plugin).
</p>
<h1>Demo</h1>
<div id="demo"><table class="tablesorter">
<thead>

View File

@ -83,6 +83,10 @@
<div id="switcher"></div>
<p class="tip">
<em>NOTE!</em> This widget can be applied to the original plugin.
</p>
<h1>Demo</h1>
<div id="demo"><table class="tablesorter">
<thead>

View File

@ -50,7 +50,12 @@
<div id="main">
<p class="tip">
<em>NOTE!</em> Click on any value in the Total column to change it to a random amount.
<em>NOTE!</em>
<ul>
<li>Click on any value in the Total column to change it to a random amount.</li>
<li>This option is part of the original plugin.</li>
<li>Automatic resorting after "updateCell" is triggered was added in version 2.0.14.</li>
</ul>
</p>
<h1>Demo</h1>

View File

@ -36,7 +36,7 @@
</div>
<p>
<strong>Author:</strong> <a class="external" href="http://lovepeacenukes.com">Christian Bach</a><br>
<strong>Version:</strong> 2.0.15 (<a href="../changelog.txt">changelog</a>)<br>
<strong>Version:</strong> 2.0.16 (forked from <a href="http://tablesorter.com/docs/">version 2.0.5</a>, <a href="../changelog.txt">changelog</a>)<br>
<strong>Licence:</strong>
Dual licensed under <a class="external" href="http://www.opensource.org/licenses/mit-license.php">MIT</a>
or <a class="external" href="http://www.opensource.org/licenses/gpl-license.php">GPL</a> licenses.
@ -300,7 +300,7 @@
<li><a href="example-apply-widget.html">Applying widgets</a></li>
<li><a href="example-zebra.html">Applying the zebra stripe widget</a></li>
<li><a href="example-ui-theme.html">Applying the jQuery UI theme widget</a> <span class="tip"><em>New! v2.0.9</em></span></li>
<li><a href="example-options-headers.html">Disable or set the column parser using class names</a> <span class="tip"><em>New! v2.0.11</em></span></li>
<li><a href="example-parsers-class-name.html">Disable or set the column parser using class names</a> <span class="tip"><em>New! v2.0.11</em></span></li>
<li><a href="example-options-headers.html">Disable sort using headers options</a></li>
<li><a href="example-options-headers-locked.html">Lock sort order using header options</a></li>
<li><a href="example-options-headers-order.html">Set initial sort order using header options</a></li>
@ -317,6 +317,7 @@
<li><a href="example-triggers.html">Triggers sortEnd and sortStart (Displaying sorting progress)</a></li>
<li><a href="example-empty-table.html">Initializing tablesorter on a empty table</a></li>
<li><a href="example-ajax.html">Appending table data with ajax</a></li>
<li><a href="example-add-rows.html">Advanced: Adding a table row</a> <span class="tip"><em>New! v2.0.16</em></span></li>
<li><a href="example-update-cell.html">Update the table after cell content has changed</a></li>
<li><a href="example-option-text-extraction.html">Dealing with markup inside cells (textExtraction function)</a></li>
<li><a href="example-option-render-header.html">Modify how the header is rendered to allow for custom styling</a></li>
@ -785,6 +786,21 @@ $(function(){
</thead>
<tbody>
<tr id="addrows">
<td><a href="#" class="toggle2">addRows</a></td>
<td>Use this method to add table rows. <span class="tip"><em>New!</em> in v2.0.16</span>
<div class="collapsible">
It does not work the same as "update" in that it only adds rows, it does not remove them.<br>
Also, use this method to add table rows while using the pager plugin. If the "update" method is used, only the visible table rows continue to exist.
<pre class="js">// Add multiple rows to the table
var $row = $('&lt;tr&gt;&lt;td&gt;Inigo&lt;/td&gt;&lt;td&gt;Montoya&lt;/td&gt;&lt;td&gt;34&lt;/td&gt;&lt;td&gt;$19.99&lt;/td&gt;&lt;td&gt;15%&lt;/td&gt;&lt;td&gt;Sep 25, 1987 12:00PM&lt;/td&gt;&lt;/tr&gt;');
$('table')
.find('tbody').append($row)
.trigger('addRows', [$row]);</pre></div>
</td>
<td><a href="example-add-rows.html">Example</a></td>
</tr>
<tr id="sorton">
<td><a href="#" class="toggle2">sorton</a></td>
<td>Use this method to sort an initialized table in the desired order.

View File

@ -1,6 +1,6 @@
/*
* TableSorter 2.0 - Client-side table sorting with ease!
* Version 2.0.15
* Version 2.0.16
* @requires jQuery v1.2.3
*
* Copyright (c) 2007 Christian Bach
@ -630,7 +630,7 @@
this.order = this.count++ % 2;
// always sort on the locked order.
if(typeof(this.lockedOrder) !== "undefined" && this.lockedOrder !== false) { this.order = this.lockedOrder; }
// user only whants to sort on one column
// user only wants to sort on one column
if (!e[config.sortMultiSortKey]) {
// flush the sort list
config.sortList = [];
@ -711,6 +711,25 @@
cache.normalized[pos[0]][pos[1]] = config.parsers[pos[1]].format(getElementText(config, cell, pos[1]), cell);
$this.trigger("sorton", [config.sortList]);
})
.bind("addRows", function(e, row) {
var i, config = this.config, rows = row.filter('tr').length,
dat = [], l = row[0].cells.length;
// add each row
for (i = 0; i < rows; i++) {
// add each cell
for (j = 0; j < l; j++) {
dat[j] = config.parsers[j].format(getElementText(config, row[i].cells[j], j), row[i].cells[j]);
}
// add the row index to the end
dat.push(cache.row.length);
// update cache
cache.row.push([row[i]]);
cache.normalized.push(dat);
dat = [];
}
// resort using current settings
$this.trigger("sorton", [config.sortList]);
})
.bind("sorton", function(e, list) {
$(this).trigger("sortStart", tbl[0]);
config.sortList = list;

File diff suppressed because one or more lines are too long