Results 1 to 9 of 9

Thread: new GridPanel and new Store, but new GridPanel still using old Store

  1. #1
    Ext JS Premium Member
    Join Date
    Nov 2010
    Posts
    130

    Default new GridPanel and new Store, but new GridPanel still using old Store

    I'm pretty new to ext, have mercy.

    See below for code. I have a tabPanel, a store that extends JsonStore (myStore), and a panel that extends gridpanel (myPanel). I create a new store in the constructor of myPanel.

    If I open a new tab, tabPanel.add(new myPanel({tree:'hugger'});
    then close that newly opened tab
    then open a new different tab, tabPanel.add(new myPanel({tree:'killer'})

    The 2nd tab will display the store information for the tree:hugger instead of tree:killer. I'm 100% positive that the server is receiving a new request for the second store instantiation, and that it's returning the correct information. It's like it receives the new data, but still uses store data from the first request it received. If I don't close the first tab, it seems to function fine.

    The below code is heavily edited for forum posting, so ignore any syntax errors you may find.

    Code:
    myStore = Ext.extend(Ext.data.JsonStore, {
        constructor: function(params) {
    		params = params || {};
    		
    		myStore.superclass.constructor.call(this, Ext.apply({
                root: 'rows',
                url: 'json/users/',
                remoteSort: true,
                baseParams: params,
                autoLoad: {params:{start: 0, limit: 20}},
                fields: [
                    {
                        name: 'User_id'
                    },
                    {
                        name: 'User_username'
                    },
                    {
                        name: 'Group_name'
                    }
                ]
            },cfg));
        }
    });
    
    myPanel = Ext.extend(Ext.grid.GridPanel, {
    	constructor: function(cfg, params) {
    		cfg = cfg || {};
    		params = params || {};
    		
    		this.store = new myStore(params);
    		
    		myPanel .superclass.constructor.call(this, Ext.apply({
    			stripeRows: true,
    			loadMask: true,
    			closable: true,
    			title: 'Users',
    			autoExpandColumn: 'username',
    			store: this.store,
    			height: 500,
    			bbar: {
                	                  xtype: 'paging',
                	                  store: this.store,
                	                  displayInfo: true
            	        },
    			columns: [
    				{
    				    xtype: 'gridcolumn',
    				    header: 'Group',
    				    sortable: true,
    				    width: 100,
    				    dataIndex: 'Group_name'
    			    },
    			    {
    			    	xtype: 'gridcolumn',
    			    	id: 'username',
    	                        dataIndex: 'User_username',
    	                        header: 'Username',
    	                        sortable: true
    	                  }
                  ]
            }, cfg));
        }
    });

  2. #2
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    This must be cause by something else you are doing, because this code looks just fine.

  3. #3
    Ext JS Premium Member
    Join Date
    Nov 2010
    Posts
    130

    Default

    I'm still having this issue and it seems to be a problem with the Ext framework.

    We're evaluating Ext for use in a commercial project and we've been in touch with sales, but they have been somewhere between unhelpful and rude. Can anyone offer additional help?

    When the second tab is opened, I can see the ajax request be sent via Firebug and it gets a proper response. The new tab has a proper title, but displays information from the old store and the loadmask is not displayed. It's like it's caching and reusing the old tab.

  4. #4
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    1. Your myStore constructor parameter is called 'params', but in the Ext.apply you use 'cfg'. Shouldn't that be 'params' too?
    2. In the myPanel constructor I would assign the store to local variable 'store' instead of to 'this.store'.
    3. Are you sure you are not using the same panel or store id for the different tabs?

  5. #5
    Ext JS Premium Member
    Join Date
    Nov 2010
    Posts
    130

    Default

    1. params is dedicated for use with the baseParams of the store. I see the dangling cfg in the Ext.apply, that shouldn't be there. I'm assuming Ext.apply is treating it like an empty object, but I'll remove it.
    2. I believe I've tried this, but switched to an object variable because I don't understand when stores get autodestroyed and wanted to ensure it persisted. I'll make sure this gets tried.
    3. Both tabs are of type myPanel, but are new objects. Tabs are added just like in the first post, "tabPanel.add(new myPanel({tree:'hugger'});" I didn't set the storeid on either tab because I knew they wouldn't be reused.

  6. #6
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    I still think your error is somewhere else and not in this segment of code.

  7. #7
    Ext JS Premium Member
    Join Date
    Nov 2010
    Posts
    130

    Default

    I appreciate the help, and I'm not ruling it out, but so far I would disagree. I've simplified my project and linked it below. The error still occurs in this simplified form. The zip contains one php file to simulate database calls.

    Links
    ----------
    Example project: http://devel.sscsvc.com/~bclay/ext%20error/
    Example zip of project: http://devel.sscsvc.com/~bclay/ext%20error.zip

    Project use
    ------------
    Double clicking on a group name in the "Groups" tab opens a gridpanel in a new tab of the users in that group

    Scenario 1
    ------------
    As long as no tabs are closed, there are no problems.
    Double click on "Test" in the "Groups tab"
    Double click on "Administrators" in the "Groups tab"
    This works as expected with each gridpanel containing the proper information.

    Scenario 2
    ------------
    Open the group "Test" from the "Groups" tab
    Close the "Test users" tab
    Open the group "Administrators" from the "Groups" tab

    You will notice the "Administrators users" tab contains the users from the "Test" group.
    If you check firebug, or the like, you will see the proper ajax is sent.
    The loadmask never appears on the new tab.

  8. #8
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    Hmm... The tab is not destroyed when you click close. There must be something preventing it from closing...

    ps. Small error (but not the cause of your problem):
    Code:
    usersStore = Ext.extend(Ext.data.JsonStore, {
        constructor: function(params, limit) {
            params = params || {};
            groupsStore.superclass.constructor.call(this, {

  9. #9
    Ext JS Premium Member
    Join Date
    Nov 2010
    Posts
    130

    Default

    That was the tipoff. Setting the autoDestroy to true on the tabPanel took care of the issue. I had assumed that autoDestroy in this context would be for the entire panel and not an individual tab in the panel.

Similar Threads

  1. GridPanel and Store - Multiple Grids for one store
    By johughes in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 26 Oct 2011, 12:49 AM
  2. GridPanel and Store Question
    By gr8ergeek in forum Ext 2.x: Help & Discussion
    Replies: 5
    Last Post: 10 Jul 2009, 7:44 AM
  3. How does GridPanel know when its Store loads?
    By Jazor in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 27 May 2009, 4:59 AM
  4. Understanding Store and GridPanel
    By adriank in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 17 May 2009, 7:07 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •