PDA

View Full Version : ListPagingPlugin



NickT
12 Oct 2011, 10:00 AM
Hello,
I was wondering what your 2.0 plans are regarding the ListPagingPlugin?

I ended up creating an extension of Ext.form.Select in 1.1 so that I could force the List to appear even on an iphone, because i required paging. So, I am also curious about Picker in terms of paging (perhaps behind the scenes paging to fetch and cache)

thanks. This is great stuff. I am close to a conversion on my stack in just an hour or so, and I have oodles of extension classes, so thanks for such forward mindedness about the migration.

rdougan
12 Oct 2011, 10:17 AM
This will be converted over for the Touch 2.0 release.

NickT
12 Oct 2011, 10:24 AM
for what its worth I modified ListPagingPlugin to support previous page as well as the existing next page...



Ext.override(Ext.plugins.ListPagingPlugin, { loadPreviousText: 'Previous Page',
render : function() {
var list = this.list,
targetEl = list.getTargetEl(),
html = '',
phtml = '';


if (!this.autoPaging) {
html += '<div class="x-list-paging-msg">' + this.loadMoreText + '</div>';
phtml += '<div class="x-list-paging-msg">' + this.loadPreviousText + '</div>';
}


this.firstEl = targetEl.insertFirst({
cls: 'x-list-paging' + (this.autoPaging ? ' x-loading' : ''),
html: phtml + Ext.LoadingSpinner
});


this.el = targetEl.createChild({
cls: 'x-list-paging' + (this.autoPaging ? ' x-loading' : ''),
html: html + Ext.LoadingSpinner
});


if (this.autoPaging) {
this.mon(targetEl.getScrollParent(), 'scrollend', this.onScrollEnd, this);
}
else {
this.mon(this.el, 'tap', this.onPagingTap, this);
this.mon(this.firstEl, 'tap', this.onPreviousPagingTap, this);
}


this.rendered = true;
},


onPreviousPagingTap : function(e) {
if (!this.loading) {
this.loading = true;
this.list.store.previousPage();
this.firstEl.addCls('x-loading');
}
},
onListUpdate : function() {
if (!this.list.store) {
return false;
}
if (!this.rendered) {
this.render();
}
if (!this.autoPaging) {
var storeReader = this.list.store.proxy.reader;
var totalRecords = storeReader.jsonData[storeReader.totalProperty];
if (totalRecords <= (this.list.store.currentPage * this.list.store.pageSize)) {
}
else {
this.el.appendTo(this.list.getTargetEl());
this.el.removeCls('x-loading');
}
if (this.list.store.currentPage == 1) {
}
else {
this.list.getTargetEl().insertFirst(this.firstEl);
this.firstEl.removeCls('x-loading');
}
}


this.loading = false;
},


onScrollEnd : function(scroller, pos) {
if (pos.y >= Math.abs(scroller.offsetBoundary.top)) {
this.loading = true;
this.list.store.nextPage();
}
else if (pos.y == 0) {
this.loading = true;
this.list.store.previousPage();
}
}
});

teslin
17 Nov 2011, 9:12 AM
I too had been thinking as to what all could have the users here thought about on working with the ListPagingPlugin. It is good to learn that you have created an Ext.form extension. From the looks of what you have suggested here regarding doing the same, I am quite sure that the ListPaging plugin has lots of applications.o we have a plugin that supports hr services (http://www.paycor.com/)management in any ways?