Only show Paging Toolbar when appropriate

One of Sencha User, Joel, pointed out one of problems in Sencha Touch ListPagingPlugin that display ‘Load more…’ message even if a result gave less rows than paging size.

Below code he suggested will fix the problem:

Ext.override(Ext.plugins.ListPagingPlugin, {
onListUpdate : function() {
if (this.list.store && this.list.store.data.length < (this.list.store.currentPage * this.list.store.pageSize)) {
if (!this.rendered) {
return false;
} else if (!this.autoPaging) {
this.el.removeCls('x-loading');
this.el.remove();
} else {
this.loading = false;
}
return false;
}

if (!this.rendered) {
this.render();
}

this.el.appendTo(this.list.getTargetEl());
if (!this.autoPaging) {
this.el.removeCls('x-loading');
}
this.loading = false;
}
});

 

2 Replies to “Only show Paging Toolbar when appropriate”

  1. I am getting an exception thrown sometimes on the line:

    this.el.appendTo(this.list.getTargetEl());

    Error: NOT_FOUND_ERR: DOM Exception 8

    There is something in this.el and also this.list.getTargetEl()

    What does that line do?

  2. I have the same problem and if i change the el.remove with a el.hide then it works fine for me.

    Ext.override(Ext.plugins.ListPagingPlugin, {
    onListUpdate : function() {
    if (this.list.store && this.list.store.data.length < (this.list.store.currentPage * this.list.store.pageSize)) {
    if (!this.rendered) {
    return false;
    } else if (!this.autoPaging) {
    this.el.removeCls('x-loading');
    // this.el.remove();
    this.el.hide();
    } else {
    this.loading = false;
    }
    return false;
    }

    if (!this.rendered) {
    this.render();
    }

    this.el.appendTo(this.list.getTargetEl());
    this.el.show();
    if (!this.autoPaging) {
    this.el.removeCls('x-loading');
    }
    this.loading = false;
    }
    });

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.