ExtJS Grid Paging: le bouton suivant est désactivé!

Question

J'ai créé une grille de base dotée d'une barre d'outils de pagination. Pour une raison quelconque lorsque je charge à l'index 0, le bouton Page suivante est désactivé, même si le texte dit "Affichage de la page 1 de 5". Si je choisis quelque chose de plus haut que 0 dans les paramètres de chargement pour le magasin, cela me permet de faire des paginations avant et arrière, mais il n'affiche pas correctement le nombre maximum de pages et si je reviens à la première page, le bouton suivant encore désactivé.

Des idées?

function getBugGrid(activityPanelWrapper){ 
    var pageSize = 5; 
    var bugStore = new Ext.data.JsonStore({ 
              reader: new Ext.data.JsonReader({ 
                      totalProperty: 'total_count' 
                      }), 
              autoLoad: {params:{start: 0, limit: pageSize}}, 
              autoDestroy: true, 
              url: '/bugs/fetch', 
              idProperty: 'id', 
              region: 'center', 
              root: 'data', 
              storeId: 'bugStore', 
              fields: [...] 
             }); 

    var columnModel = new Ext.grid.ColumnModel({ 
               defaults: { 
               width: 120, 
               sortable: true 
               }, 
               columns: [...] 
              }); 

    return new Ext.grid.GridPanel({ 
             region: 'center', 
             store: bugStore, 
             colModel: columnModel, 
             trackMouseOver:false, 
             loadMask: true, 
             sm: new Ext.grid.RowSelectionModel({singleSelect:true}), 
             listeners: { 
             rowclick: { 
              fn: function(grid, rowIndex, event) { 
              var bug_id = grid.store.getAt(rowIndex).id; 
              Ext.getCmp('activity-panel').load(activity_lines_path(bug_id)); 
              } 
             } 
             }, 
             bbar: new Ext.PagingToolbar({ 
                    pageSize: pageSize, 
                    store: bugStore, 
                    displayInfo: true, 
                    displayMsg: 'Displaying topics {0} - {1} of {2}', 
                    emptyMsg: "No topics to display" 
                    }) 
            }); 
} 

réponse JSON:

{"data":[{ bug 1 },{ bug 2 },{ bug 3 },{ bug 4 },{ bug 5 }], 
"errors":{}, 
"total_count":25} 

Answer 1

Vous ne lisez pas le TotalProperty dans le JsonReader ...

Vous devez ajouter cette configuration à votre autoLoad ...

var bugStore = new Ext.data.JsonStore({ 
    autoDestroy: true, 
    url: '/bugs/fetch', 
    idProperty: 'id', 
    root: 'data', 
    storeId: 'bugStore', 
    fields: [ ... ] 
    autoLoad: {params:{start: 0, limit: pagesize}} 
}); 

Vous pouvez également définir un lecteur JSON dans votre magasin JSON:

var myStore = new Ext.data.Store({ 
reader: new Ext.data.JsonReader({ 
    totalProperty: 'total_count', 
    ... 
}), 
... 

});