1. #31
    Ext User
    Join Date
    Feb 2009
    Posts
    2
    Vote Rating
    0
    hemvanh is on a distinguished road

      0  

    Default


    Quote Originally Posted by andycramb View Post
    Thanks
    Added lastOptions instead of baseParams
    Could not getting paging to work onLoad
    When I clicked the refresh button it worked to a degree but the first page had 6 records when I had this specified

    Code:
    lastOptions: {params:{start: 0,limit: 4}},
    I uploaded the latest version to http://www.cramb.org.uk/extjs/paging/main.html
    I also can not make the paging to work when the page loaded for the first time, any solution for this yet? or am i doing something wrong here :

    LGjsonReader=new Ext.data.JsonReader({
    root: 'rootLeague',
    totalProperty:'totalCount',
    id: 'ModuleId'
    },[
    {name: 'ModuleId'},
    {name: 'ModuleName'},
    {name: 'Selected'}
    ]);

    .................

    leagueStore = new Ext.ux.data.PagingStore({
    proxy: new Ext.data.HttpProxy({method:'post', url:'rManageOddsSel.aspx?m=league'+pars})
    ,sortInfo: {
    field: 'Selected',
    direction: "DESC"
    }
    , reader: LGjsonReader
    ,lastOptions: { params: { start: 0, limit: 12} }
    });

    LGcolModel = new Ext.grid.ColumnModel([
    {id:"ModuleId", header: "ID", width: 100, dataIndex: 'ModuleId',hidden:true},
    {header: "", width: 50, renderer:putLgCheckBox, dataIndex: 'Selected',align:'center'},
    {header: "Module Name", width: 700, dataIndex: 'ModuleName'}
    ]);

    ........


    },{
    xtype: 'grid',
    store: leagueStore,
    colModel:LGcolModel,
    height:500,
    width:785,
    title:'Select Leagues',
    id:'lg_mt_Grid'
    ,bbar: new Ext.PagingToolbar({
    pageSize: 12,
    store: leagueStore
    })

    please help me

  2. #32
    Ext User
    Join Date
    Feb 2009
    Posts
    2
    Vote Rating
    0
    hemvanh is on a distinguished road

      0  

    Default


    i got it from another thread

    paging_store.load({params:{start:0, limit:5}});

    http://extjs.com/forum/showthread.php?t=60757
    everything's fine now

    thanks alot

  3. #33
    Sencha User
    Join Date
    Dec 2008
    Location
    NYC
    Posts
    182
    Vote Rating
    0
    whodat is on a distinguished road

      0  

    Default


    Hi Condor,

    I'm trying to submit a form and load the PagingStore with the Records in the action.result.

    The grid remains empty, but once I click the refresh button in the Toolbar, the grid loads properly.

    I'm assuming I am not properly loading the store. Can you assist me?
    Code:
                   listeners: {
                       searchForResults: function(){
                            searchCriteriaPanel.getForm().submit({
                                url: '/TEST/employee_search.hra',
                                method: 'POST',
                                success: function(f, a){
                                    //alert(a.result);
                                    searchResultsGrid=createSearchResultGrid();
                                    searchResultsGrid.getStore().loadData(a.result, true);  
                                    searchResultsGrid.getStore().applyPaging();
                                    searchResultsGrid.getStore().fireEvent('datachanged', searchResultsGrid.getStore());  
                                    
                                  
                                },
                                failure: function(f, a){
                                    Ext.Msg.alert('Warning', a.failureType);
                                }
                            });      
                       },

  4. #34
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    89
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    Do you really want to append the records? Otherwise you can simply use:
    Code:
    searchResultsGrid.getStore().loadData(a.result[s]);
    ps. You might need to reset paging to the first page before loading by changing lastOptions, e.g.
    Code:
    store.lastOptions.params = Ext.applyIf({start: 0, limit: pagingToolbar.pageSize}, store.lastOptions.params);
    Last edited by Condor; 19 Mar 2009 at 2:58 AM. Reason: Fixed

  5. #35
    Sencha User
    Join Date
    Dec 2008
    Location
    NYC
    Posts
    182
    Vote Rating
    0
    whodat is on a distinguished road

      0  

    Default


    Quote Originally Posted by Condor View Post
    Do you really want to append the records? Otherwise you can simply use:
    Code:
    searchResultsGrid.getStore().loadData(a.result/*, true*/);
    //searchResultsGrid.getStore().applyPaging();
    //searchResultsGrid.getStore().fireEvent('datachanged', searchResultsGrid.getStore());
    ps. You might need to reset paging to the first page before loading by changing lastOptions, e.g.
    Code:
    store.lastOptions = Ext.applyIf({start: 0, limit: pagingToolbar.pageSize}, store.lastOptions);
    Thanks Condor, I'll try it out as soon as I hit the office.. And no, I do not want to append, but I figured the first time it would not matter.

    Code:
    searchResultsGrid.getStore().loadData(a.result);
    searchResultsGrid.getStore().lastOptions)= Ext.applyIf({start: 0, limit: pagingToolbar.pageSize}, store.lastOptions);

  6. #36
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    89
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    The code I posted wasn't correct. It should have been:
    Code:
    if(searchResultsGrid.getStore().lastOptions){
        searchResultsGrid.getStore().lastOptions.params =
            Ext.applyIf({start: 0, limit: pagingToolbar.pageSize}, store.lastOptions.params);
    }
    searchResultsGrid.getStore().loadData(a.result);

  7. #37
    Sencha User
    Join Date
    Dec 2008
    Location
    NYC
    Posts
    182
    Vote Rating
    0
    whodat is on a distinguished road

      0  

    Default


    Quote Originally Posted by Condor View Post
    The code I posted wasn't correct. It should have been:
    Code:
    if(searchResultsGrid.getStore().lastOptions){
        searchResultsGrid.getStore().lastOptions.params =
            Ext.applyIf({start: 0, limit: pagingToolbar.pageSize}, store.lastOptions.params);
    }
    searchResultsGrid.getStore().loadData(a.result);
    I am getting the data back, but the it displays the whole data set instead of the page limit.

    My data set size was 24 and my limit is 20.

  8. #38
    Sencha - Community Support Team Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246
    Vote Rating
    89
    Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of Condor has much to be proud of

      0  

    Default


    Try this:
    Code:
    if(!searchResultsGrid.getStore().lastOptions){
        searchResultsGrid.getStore().lastOptions = {};
    }
    searchResultsGrid.getStore().lastOptions.params =
        Ext.applyIf({start: 0, limit: pagingToolbar.pageSize}, store.lastOptions.params);
    searchResultsGrid.getStore().loadData(a.result);

  9. #39
    Sencha User
    Join Date
    Dec 2008
    Location
    NYC
    Posts
    182
    Vote Rating
    0
    whodat is on a distinguished road

      0  

    Default


    Quote Originally Posted by Condor View Post
    Try this:
    Code:
    if(!searchResultsGrid.getStore().lastOptions){
        searchResultsGrid.getStore().lastOptions = {};
    }
    searchResultsGrid.getStore().lastOptions.params =
        Ext.applyIf({start: 0, limit: pagingToolbar.pageSize}, store.lastOptions.params);
    searchResultsGrid.getStore().loadData(a.result);
    Condor, I looked at your code for the loadData method in the PagingStore class

    Code:
    loadData : function(o, append){
            this.isPaging(Ext.apply({}, this.lastOptions, this.baseParams));
            var r = this.reader.readRecords(o);
            this.loadRecords(r, {add: append}, true);
        }
    I see that you are copying the the lastOptions and baseParams with Ext.apply so I added start and limit to the baseParams of my PagingStore instantiation and this has worked.

    Is this an ok approach? If so, sorry for not posting that code...



    My code as of now:
    PagingStore creation
    Code:
    var pagingStore= new Ext.ux.data.PagingStore({
                baseParams: {
                    start: 0,
                    limit: 20
                },
                proxy:  new Ext.data.HttpProxy({url: '/HRA/employee_search.hra'}),
                reader: new Ext.data.JsonReader({totalProperty: 'resultSize', root: 'rows', id: 'employeeId'}, 
                    ['employeeName', 'group', 'function', 'employeeId'])
               });
    My form submit event
    Code:
    searchForResults: function(){
                            searchCriteriaPanel.getForm().submit({
                                url: '/HRA/employee_search.hra',
                                method: 'POST',
                                success: function(f, a){
                                    searchResultsGrid=createSearchResultGrid();
                                    
                                    if(searchResultsGrid.getStore().lastOptions){
                                        searchResultsGrid.getStore().lastOptions.params =
                                            Ext.applyIf({start: 0, limit: 20}, searchResultsGrid.getStore().lastOptions.params);
                                    }
                                    searchResultsGrid.getStore().loadData(a.result, {start: 0, limit: 20});
                                    var tabPanel=cardContainer.items.itemAt(0);
                                    tabPanel.add(searchResultsGrid);
                                    tabPanel.setActiveTab(searchResultsGrid);
                                    tabPanel.doLayout();
                                    cardContainer.doLayout();
                                    viewport.doLayout();
                                },
                                failure: function(f, a){
                                    Ext.Msg.alert('Warning', a.failureType);
                                }
                            });      
                       }
    Also, when I submit the form again, would I have to delete the lastParams in order to get a fresh set of data? Or your piece of code which copies over the the original last options and that will fire the "datachanged" event?

    Code:
    if(searchResultsGrid.getStore().lastOptions){
                                        searchResultsGrid.getStore().lastOptions.params =
                                            Ext.applyIf({start: 0, limit: 20}, searchResultsGrid.getStore().lastOptions.params);
                                    }
    Thanks again for helping

  10. #40
    Sencha User
    Join Date
    Feb 2008
    Posts
    36
    Vote Rating
    0
    johnrembo is on a distinguished road

      0  

    Exclamation regarding fix

    regarding fix


    Quote Originally Posted by Condor View Post
    That is something that is not properly handled by PagingStore.

    Could you try if this fixes it:
    Code:
    Ext.override(Ext.ux.data.PagingStore, {
    	loadRecords : function(o, options, success){
    		if(!o || success === false){
    			if(success !== false){
    				this.fireEvent("load", this, [], options);
    			}
    			if(options.callback){
    				options.callback.call(options.scope || this, [], options, false);
    			}
    			return;
    		}
    		var r = o.records, t = o.totalRecords || r.length;
    		if(!options || options.add !== true){
    			if(this.pruneModifiedRecords){
    				this.modified = [];
    			}
    			for(var i = 0, len = r.length; i < len; i++){
    				r[i].join(this);
    			}
    			if(this.allData){
    				this.data = this.allData;
    				delete this.allData;
    			}
    			if(this.snapshot){
    				this.data = this.snapshot;
    				delete this.snapshot;
    			}
    			this.data.clear();
    			this.data.addAll(r);
    			this.totalLength = t;
    			this.applySort();
    			if(!this.allData){
    				this.applyPaging();
    			}
    			if(r.length != this.getCount()){
    				r = [].concat(this.data.items);
    			}
    			this.fireEvent("datachanged", this);
    		}else{
    			this.totalLength = Math.max(t, this.data.length+r.length);
    			this.add(r);
    		}
    		options[this.paramNames.start] = this.start;
    		this.fireEvent("load", this, r, options);
    		if(options.callback){
    			options.callback.call(options.scope || this, r, options, true);
    		}
    	},
    	applyPaging : function(){
    		var start = this.start, limit = this.limit;
    		if((typeof start == 'number') && (typeof limit == 'number')){
    			var allData = this.data, data = new Ext.util.MixedCollection(allData.allowFunctions, allData.getKey);
    			if(start >= allData.getCount()){
    				start = this.start = allData.getCount() ? Math.floor((allData.getCount() - 1) / limit) : 0;
    			}
    			data.items = allData.items.slice(start, start + limit);
    			data.keys = allData.keys.slice(start, start + limit);
    			var len = data.length = data.items.length;
    			var map = {};
    			for(var i = 0; i < len; i++){
    				var item = data.items[i];
    				map[data.getKey(item)] = item;
    			}
    			data.map = map;
    			this.allData = allData;
    			this.data = data;
    		}
    	}
    });
    Code:
    store.applyPaging();
    store.fireEvent('datachanged', store);
    I can confirm your fix doesn't work for the paging toolbar.

    Two problems I've noted while using store.filter:
    1. Page count always keeps the same as well as total records count on the paging toolbar.
    2. Store shows current empty page instead of navigating to 1st page (if I filter 1 record for example)

    you fix seems to always show the same 1st page - nothing else.

    maybe additional even - "filterapplied" should be implied somehow, because I'm not sure if filtering is similar to data-changing in this case?

    any more solutions?