New: Jump to page on tables (click on page number)

This commit is contained in:
Mark McDowall
2014-03-11 01:12:18 -07:00
parent 2d028d9bc7
commit 11bc946797
8 changed files with 92 additions and 8 deletions
+44 -4
View File
@@ -1,16 +1,20 @@
'use strict';
define(
[
'jquery',
'marionette',
'backgrid.paginator'
], function (Marionette, Paginator) {
], function ($, Marionette, Paginator) {
return Paginator.extend({
template: 'Shared/Grid/PagerTemplate',
events: {
'click .pager-btn': 'changePage'
'click .pager-btn' : 'changePage',
'click .x-page-number' : '_showPageJumper',
'change .x-page-number select' : '_jumpToPage',
'blur .x-page-number select' : 'render'
},
windowSize: 1,
@@ -25,7 +29,7 @@ define(
changePage: function (e) {
e.preventDefault();
var target =this.$(e.target);
var target = this.$(e.target);
if (target.closest('li').hasClass('disabled')) {
return;
@@ -77,7 +81,7 @@ define(
var lastPage = +state.lastPage;
lastPage = Math.max(0, firstPage ? lastPage - 1 :lastPage);
var currentPage = Math.max(state.currentPage, state.firstPage);
currentPage = firstPage ? currentPage - 1 :currentPage;
currentPage = firstPage ? currentPage - 1 : currentPage;
var windowStart = Math.floor(currentPage / this.windowSize) * this.windowSize;
var windowEnd = Math.min(lastPage + 1, windowStart + this.windowSize);
@@ -145,6 +149,42 @@ define(
this.delegateEvents();
return this;
},
_showPageJumper: function (e) {
if ($(e.target).is('select')) {
return;
}
var templateFunction = Marionette.TemplateCache.get('Shared/Grid/JumpToPageTemplate');
var state = this.collection.state;
var currentPage = Math.max(state.currentPage, state.firstPage);
currentPage = state.firstPage ? currentPage - 1 : currentPage;
var pages = [];
for (var i = 0; i < this.collection.state.lastPage; i++) {
if (i === currentPage) {
pages.push({ page: i + 1, current: true });
}
else {
pages.push({ page: i + 1 });
}
}
this.$el.find('.x-page-number').html(templateFunction({
pages : pages
}));
this.$el.find('.x-page-number select').trigger('click');
},
_jumpToPage: function () {
var selectedPage = parseInt(this.$el.find('.x-page-number select').val(), 10);
this.$el.find('.x-page-number').html('<i class="icon-spinner icon-spin"></i>');
this.collection.getPage(selectedPage);
}
});
});