Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Sep 2009
    Posts
    27
    Vote Rating
    1
    Joel is on a distinguished road

      0  

    Default Paging plugin bug

    Paging plugin bug


    I posted the following fix in another forum (here) and it was suggested a post a bug report.

    When using the Ext.plugins.ListPagingPlugin if you return a result set less than the page size the 'Load more...' still shows. Conversely, when you hit the last page the 'Load more...' doesn't disappear.

    The fix to this is:

    Code:
    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;     
      } 
    });
    Last edited by Joel; 26 Jun 2011 at 2:44 PM. Reason: Formatting fix

  2. #2
    Sencha User
    Join Date
    Nov 2010
    Posts
    23
    Vote Rating
    0
    bwg is on a distinguished road

      0  

    Default


    The <= check causes the autoload to not appear if this.list.store.data.length is a multiple of pageSize. For example, 8 total records and pageSize = 4. I reverted back to <.

    I removed the return calls and placed the alternate branch of code in an else block in order to re-enable the pullrefresh plugin. Returning false, kills the loading of any additional plugins.

    Code:
            if (this.list.store && this.list.store.data.length < (this.list.store.currentPage * this.list.store.pageSize)) {
                if (!this.rendered) {
                    // do nothing
                } else if (!this.autoPaging) {
                    this.el.removeCls('x-loading');
                    this.el.remove();
                } else {
                    this.loading = false;
                }
            } else {
                if (!this.rendered) {
                    this.render();
                }
    
                this.el.appendTo(this.list.getTargetEl());
                if (!this.autoPaging) {
                    this.el.removeCls('x-loading');
                }
                this.loading = false;
            }
    NOTE: I did discover that the override doesn't work if a filter is applied. Using a sorter is ok.
    Last edited by bwg; 15 Jul 2011 at 7:11 AM. Reason: added known issue

  3. #3
    Sencha User
    Join Date
    Jul 2011
    Posts
    3
    Vote Rating
    0
    Vitaly2511 is on a distinguished road

      0  

    Default Pullrefresh plugin problem

    Pullrefresh plugin problem


    Hi!
    I've tested your fix, but I found a new error. When you returned from the 2-nd page to first through pullrefresh plugin, "Load More" dissapears (list.store.currentPage has wrong value in this moment. Should be 1, but it is 2)

  4. #4
    Sencha User
    Join Date
    Nov 2010
    Posts
    23
    Vote Rating
    0
    bwg is on a distinguished road

      0  

    Default


    @Vitaly2511

    AbstractStore#load() does not reset the currentPage property. I solved the problem by customizing the refresh function:

    Code:
    {
        ptype: 'pullrefresh',
        refreshFn: function(callback, plugin) {
            var store = plugin.list.getStore();
            store.currentPage = 1;
            store.load(function(records, operation, success) {
                callback.call(plugin);
            });
        }
    }

  5. #5
    Sencha User
    Join Date
    Jul 2011
    Posts
    3
    Vote Rating
    0
    Vitaly2511 is on a distinguished road

      0  

    Default Pullrefresh plugin problem

    Pullrefresh plugin problem


    I understand your idea, but it does not work too.
    When I return to first page, I don't see "Loading More..." control and top items in my list are absent (visual bug probably)

  6. #6
    Sencha User
    Join Date
    Nov 2010
    Posts
    23
    Vote Rating
    0
    bwg is on a distinguished road

      0  

    Default


    Ah... for my setup I had autopaging = true. When I set it to false, I can reproduce your result

  7. #7
    Touch Premium Member
    Join Date
    Aug 2010
    Location
    New York, NY
    Posts
    66
    Vote Rating
    1
    sandeep45 is on a distinguished road

      0  

    Smile


    I removed the code to remove the element. this solves the problem when a refresh loads only the first 25 requiring the code to make the "load more" button reappear.


    Code:
    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) {
                    // do nothing
                } else if (!this.autoPaging) {
                    this.el.removeCls('x-loading');
                   //this.el.remove();
                } else {
                    this.loading = false;
                }
            } else {
                if (!this.rendered) {
                    this.render();
                }
    
    
                this.el.appendTo(this.list.getTargetEl());
                if (!this.autoPaging) {
                    this.el.removeCls('x-loading');
                }
                this.loading = false;
            }
        }
    });

  8. #8
    Sencha User
    Join Date
    Oct 2011
    Posts
    1
    Vote Rating
    0
    jthalliley is on a distinguished road

      0  

    Default


    Looks like the "Load More" button does not come back. Once you get to the end of a list, and then populate the list again (in my case, due to a search function), the "Load More" is missing.

  9. #9
    Sencha User
    Join Date
    Sep 2011
    Posts
    60
    Vote Rating
    3
    janelle is on a distinguished road

      0  

    Default


    The code below is working for me. I have a global variable called TotalPages that I get from my queries. If you dont want something like that, you can just check for the # results returned < page size. I have autoLoad set to false.

    Code:
    Ext.override(Ext.plugins.ListPagingPlugin, {
        onListUpdate : function() 
        {
            if (!this.rendered)
            {
                this.render();
                return;
            }
            
            if (this.rendered && !this.autoPaging && this.list.store && this.list.store.currentPage >= TotalPages)
            {
                // hit end of list, hide link for more results
                this.el.addCls('x-loading');
                //this.el.remove();
            }
            else if(!this.autoPaging)
            {
                this.el.appendTo(this.list.getTargetEl());
                
                // show link for more results
                this.el.removeCls('x-loading');
            }
            
            this.loading = false;
        }
    });