library-mirrors/tablesorter
1
0
Fork 0
mirror of https://github.com/Mottie/tablesorter.git synced 2024-10-08 13:44:18 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Pager: add "all" setting for pageSize. See #1055

Browse Source
This commit is contained in:
Rob Garrison 2015-10-25 20:55:48 -05:00
parent e3d2fd9a17
commit 612c76e5ee
5 changed files with 71 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
addons/pager/jquery.tablesorter.pager.js
View File

@ -368,7 +368,7 @@
},
hideRowsSetup = function(table, p){
p.size = parseInt( p.$size.val(), 10 ) || p.size || p.settings.size || 10;
p.size = parsePageSize( p, p.$size.val(), 'get' ) || p.size || p.settings.size || 10;
$.data(table, 'pagerLastSize', p.size);
pagerArrows(p);
if ( !p.removeRows ) {
@ -764,9 +764,18 @@
}
},
// set to either set or get value
parsePageSize = function( p, size, mode ) {
var s = parseInt( size, 10 );
return /all/i.test( size ) || s === p.totalRows ?
// "get" to set `p.size` or "set" to set `p.$size.val()`
( mode === 'get' ? p.totalRows : 'all' ) :
( mode === 'get' ? s : p.size );
},
setPageSize = function(table, size, p) {
p.size = size || p.size || p.settings.size || 10;
p.$size.val(p.size);
p.size = parsePageSize( p, size, 'get' ) || p.size || p.settings.size || 10;
p.$size.val( parsePageSize( p, size, 'set' ) );
$.data(table, 'pagerLastPage', p.page);
$.data(table, 'pagerLastSize', p.size);
p.totalPages = Math.ceil( p.totalRows / p.size );
@ -821,7 +830,7 @@
},
enablePager = function(table, p, triggered) {
var info,
var info, size,
c = table.config;
p.$size.add(p.$goto).add(p.$container.find('.ts-startRow, .ts-page'))
.removeClass(p.cssDisabled)
@ -830,8 +839,9 @@
p.isDisabled = false;
p.showAll = false;
p.page = $.data(table, 'pagerLastPage') || p.page || 0;
p.size = $.data(table, 'pagerLastSize') || parseInt(p.$size.find('option[selected]').val(), 10) || p.size || p.settings.size || 10;
p.$size.val(p.size); // set page size
size = p.$size.find('option[selected]').val();
p.size = $.data(table, 'pagerLastSize') || parsePageSize( p, size, 'get' ) || p.size || p.settings.size || 10;
p.$size.val( parsePageSize( p, size, 'set' ) ); // set page size
p.totalPages = Math.ceil( Math.min( p.totalRows, p.filteredRows ) / p.size );
// if table id exists, include page display with aria info
if ( table.id ) {
@ -951,27 +961,27 @@
changeHeight(table, p);
updatePageDisplay(table, p, true);
})
.bind('pageSize refreshComplete '.split(' ').join(namespace + ' '), function(e, v){
.bind('pageSize refreshComplete '.split(' ').join(namespace + ' '), function(e, size){
e.stopPropagation();
setPageSize(table, parseInt(v, 10) || p.settings.size || 10, p);
setPageSize(table, parsePageSize( p, size, 'get' ) || p.settings.size || 10, p);
hideRows(table, p);
updatePageDisplay(table, p, false);
})
.bind('pageSet pagerUpdate '.split(' ').join(namespace + ' '), function(e, v){
.bind('pageSet pagerUpdate '.split(' ').join(namespace + ' '), function(e, num){
e.stopPropagation();
// force pager refresh
if (e.type === 'pagerUpdate') {
v = typeof v === 'undefined' ? p.page + 1 : v;
num = typeof num === 'undefined' ? p.page + 1 : num;
p.last.page = true;
}
p.page = (parseInt(v, 10) || 1) - 1;
p.page = (parseInt(num, 10) || 1) - 1;
moveToPage(table, p, true);
updatePageDisplay(table, p, false);
})
.bind('pageAndSize' + namespace, function(e, page, size){
e.stopPropagation();
p.page = (parseInt(page, 10) || 1) - 1;
setPageSize(table, parseInt(size, 10) || p.settings.size || 10, p);
setPageSize(table, parsePageSize( p, size, 'get' ) || p.settings.size || 10, p);
moveToPage(table, p, true);
hideRows(table, p);
updatePageDisplay(table, p, false);
@ -1018,9 +1028,10 @@
// setting an option as selected appears to cause issues with initial page size
p.$size.find('option').removeAttr('selected');
p.$size.unbind('change' + namespace).bind('change' + namespace, function() {
p.$size.val( $(this).val() ); // in case there are more than one pagers
if ( !$(this).hasClass(p.cssDisabled) ) {
setPageSize(table, parseInt( $(this).val(), 10 ), p);
var size = $(this).val();
p.$size.val( size ); // in case there are more than one pagers
setPageSize(table, size, p);
changeHeight(table, p);
}
return false;

4
docs/example-pager.html
View File

@ -236,6 +236,7 @@
<p class="tip">
<em>NOTE!</em> The following are not part of the original plugin:
<ul>
<li>In <span class="version updated">2.23.6</span>, a page size select option with a value of "all" will display all rows - not recommended for ajax interactions!</li>
<li>In <span class="version updated">v2.23.0</span>, the following methods were changed due to issues with unique namespacing.
<ul>
<li><code>destroy.pager</code> is now <code>destroyPager</code></li>
@ -275,6 +276,7 @@
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
<option value="all">All Rows</option>
</select>
<select class="gotoPage" title="Select page number"></select>
</div>
@ -369,6 +371,7 @@
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
<option value="all">All Rows</option>
</select>
<select class="gotoPage" title="Select page number"></select>
</div>
@ -442,6 +445,7 @@ td.tablesorter-pager {
&lt;option value=&quot;20&quot;&gt;20&lt;/option&gt;
&lt;option value=&quot;30&quot;&gt;30&lt;/option&gt;
&lt;option value=&quot;40&quot;&gt;40&lt;/option&gt;
&lt;option value=&quot;all&quot;&gt;All Rows&lt;/option&gt;
&lt;/select&gt;
&lt;/form&gt;
&lt;/div&gt;</pre>

4
docs/example-widget-pager.html
View File

@ -233,6 +233,7 @@
<p class="tip">
<em>NOTE!</em>
<ul>
<li>In <span class="version updated">2.23.6</span>, a page size select option with a value of "all" will display all rows - not recommended for ajax interactions!</li>
<li>In <span class="version">v2.19.0</span>, added <code>pageAndSize</code> method which allows setting both the pager page &amp; size.</li>
<li>In <span class="version">v2.17.6</span>, added <code>{startRow:input}</code> and <code>{page:input}</code> variables to the <code>output</code> option.<p></p></li>
@ -275,6 +276,7 @@
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
<option value="all">All Rows</option>
</select>
<select class="gotoPage" title="Select page number"></select>
</div>
@ -369,6 +371,7 @@
<option value="20">20</option>
<option value="30">30</option>
<option value="40">40</option>
<option value="all">All Rows</option>
</select>
<select class="gotoPage" title="Select page number"></select>
</div>
@ -454,6 +457,7 @@ td.tablesorter-pager {
&lt;option value=&quot;20&quot;&gt;20&lt;/option&gt;
&lt;option value=&quot;30&quot;&gt;30&lt;/option&gt;
&lt;option value=&quot;40&quot;&gt;40&lt;/option&gt;
&lt;option value=&quot;all&quot;&gt;All Rows&lt;/option&gt;
&lt;/select&gt;
&lt;/form&gt;
&lt;/div&gt;</pre>

16
docs/index.html
View File

@ -485,9 +485,9 @@
<br><br>
</li>
<li>Pager plugin (<a href="example-pager.html">basic</a> &amp; <a href="example-pager-ajax.html">ajax</a> demos; <span class="version updated">v2.23.5</span>).</li>
<li>Pager plugin (<a href="example-pager.html">basic</a> &amp; <a href="example-pager-ajax.html">ajax</a> demos; <span class="version updated">v2.23.6</span>).</li>
<li>
Pager widget (<a href="example-widget-pager.html">basic</a> &amp; <a href="example-widget-pager-ajax.html">ajax</a> demos) (<span class="version">v2.12</span>; <span class="version updated">v2.23.5</span>).<br>
Pager widget (<a href="example-widget-pager.html">basic</a> &amp; <a href="example-widget-pager-ajax.html">ajax</a> demos) (<span class="version">v2.12</span>; <span class="version updated">v2.23.6</span>).<br>
<br>
</li>
@ -5136,11 +5136,13 @@ $('table').trigger( 'search', [['', '', '', '', 'orange']] ); // find orange in
<tbody>
<tr id="pagesize">
<td><a href="#" class="permalink">pageSize</a></td>
<td>Trigger the pager to change the page size (v2.7.4).
<td>Trigger the pager to change the page size (v2.7.4; <span class="version updated">2.23.6</span>).
<div class="collapsible">
<pre class="prettyprint lang-js">$(function(){
$('table').trigger('pageSize', 15);
});</pre></div>
});</pre>
In <span class="version updated">2.23.6</span>, this option will now accept "all" as a setting, and in turn display all rows.
</div>
</td>
<td></td>
</tr>
@ -5158,13 +5160,15 @@ $('table').trigger( 'search', [['', '', '', '', 'orange']] ); // find orange in
</tr>
<tr id="pageandsize">
<td><a href="#" class="permalink">pageAndSize</a></td>
<td>Trigger the pager to change the current page &amp; size (<span class="version">v2.19.0</span>).
<td>Trigger the pager to change the current page &amp; size (<span class="version">v2.19.0</span>; ; <span class="version updated">2.23.6</span>).
<div class="collapsible">
<br>
If no value is passed, the pager will reset to page 1 with the original pager size setting; otherwise, pass a "one-based" index of the desired page and the pager size as an array
<pre class="prettyprint lang-js">$(function(){
$('table').trigger('pageAndSize', [ 2, 20 ]); // pass a one-based page index & page size
});</pre></div>
});</pre>
In <span class="version updated">2.23.6</span>, this option will now accept "all" as a page size setting, and in turn display all rows; the page number will be force to page one.
</div>
</td>
<td></td>
</tr>

43
js/widgets/widget-pager.js
View File

@ -296,27 +296,27 @@
ts.applyWidget( table );
tsp.updatePageDisplay(table, c);
})
.on('pageSize refreshComplete '.split(' ').join(namespace + ' '), function(e, v){
.on('pageSize refreshComplete '.split(' ').join(namespace + ' '), function(e, size){
e.stopPropagation();
tsp.setPageSize(table, parseInt(v, 10) || p.setSize || 10, c);
tsp.setPageSize(table, tsp.parsePageSize( p, size, 'get' ) || p.setSize || 10, c);
tsp.hideRows(table, c);
tsp.updatePageDisplay(table, c, false);
})
.on('pageSet pagerUpdate '.split(' ').join(namespace + ' '), function(e, v){
.on('pageSet pagerUpdate '.split(' ').join(namespace + ' '), function(e, num){
e.stopPropagation();
// force pager refresh
if (e.type === 'pagerUpdate') {
v = typeof v === 'undefined' ? p.page + 1 : v;
num = typeof num === 'undefined' ? p.page + 1 : num;
p.last.page = true;
}
p.page = (parseInt(v, 10) || 1) - 1;
p.page = (parseInt(num, 10) || 1) - 1;
tsp.moveToPage(table, p, true);
tsp.updatePageDisplay(table, c, false);
})
.on('pageAndSize' + namespace, function(e, page, size){
e.stopPropagation();
p.page = (parseInt(page, 10) || 1) - 1;
tsp.setPageSize(table, parseInt(size, 10) || p.setSize || 10, c);
tsp.setPageSize(table, tsp.parsePageSize( p, size, 'get' ) || p.setSize || 10, c);
tsp.moveToPage(table, p, true);
tsp.hideRows(table, c);
tsp.updatePageDisplay(table, c, false);
@ -364,9 +364,10 @@
p.$size
.off('change' + namespace)
.on('change' + namespace, function() {
p.$size.val( $(this).val() ); // in case there are more than one pagers
if ( !$(this).hasClass(wo.pager_css.disabled) ) {
tsp.setPageSize(table, parseInt( $(this).val(), 10 ), c);
var size = $(this).val();
p.$size.val( size ); // in case there are more than one pagers
tsp.setPageSize(table, size, c);
tsp.changeHeight(table, c);
}
return false;
@ -634,8 +635,9 @@
hideRowsSetup: function(table, c){
var p = c.pager,
namespace = c.namespace + 'pager';
p.size = parseInt( p.$size.val(), 10 ) || p.size || p.setSize || 10;
namespace = c.namespace + 'pager',
size = p.$size.val();
p.size = tsp.parsePageSize( p, size, 'get' ) || p.size || p.setSize || 10;
$.data(table, 'pagerLastSize', p.size);
tsp.pagerArrows(c);
if ( !c.widgetOptions.pager_removeRows ) {
@ -1042,10 +1044,19 @@
}
},
// set to either set or get value
parsePageSize: function( p, size, mode ) {
var s = parseInt( size, 10 );
return /all/i.test( size ) || s === p.totalRows ?
// "get" to set `p.size` or "set" to set `p.$size.val()`
( mode === 'get' ? p.totalRows : 'all' ) :
( mode === 'get' ? s : p.size );
},
setPageSize: function(table, size, c) {
var p = c.pager;
p.size = size || p.size || p.setSize || 10;
p.$size.val(p.size);
p.size = tsp.parsePageSize( p, size, 'get' ) || p.size || p.setSize || 10;
p.$size.val( tsp.parsePageSize( p, p.size, 'set' ) );
$.data(table, 'pagerLastPage', p.page);
$.data(table, 'pagerLastSize', p.size);
p.totalPages = Math.ceil( p.totalRows / p.size );
@ -1103,12 +1114,14 @@
},
enablePager: function(table, c, triggered){
var info, p = c.pager;
var info, size,
p = c.pager;
p.isDisabled = false;
p.showAll = false;
p.page = $.data(table, 'pagerLastPage') || p.page || 0;
p.size = $.data(table, 'pagerLastSize') || parseInt(p.$size.find('option[selected]').val(), 10) || p.size || p.setSize || 10;
p.$size.val(p.size); // set page size
size = p.$size.find('option[selected]').val();
p.size = $.data(table, 'pagerLastSize') || tsp.parsePageSize( p, size, 'get' ) || p.size || p.setSize || 10;
p.$size.val( tsp.parsePageSize( p, size, 'set' ) ); // set page size
p.totalPages = Math.ceil( Math.min( p.totalRows, p.filteredRows ) / p.size );
c.$table.removeClass('pagerDisabled');
// if table id exists, include page display with aria info