Results 1 to 7 of 7

Thread: problem about switch gridpanels in a panel

  1. #1

    Question problem about switch gridpanels in a panel

    The layout is like this:
    west region is a tree, when I click a node, the corresponding gridpanel shown in center region.

    Now when I click 'A' node, the 'A' gridpanel shown good, but the problem is when i click B node, the 'B' gridpanel don't show grid content, just tbar,header and bbar. the configure of 'B' gridpanel is same as 'A'.
    And, if i change click order, then 'B' gridpanel shown good instead of 'A'.

    Below is my code:

    1?this is outermost panel
    Code:
    this.panel = new Ext.Panel( {
    				id:'py-permission-console',
    				title :'Permission Console',
    				layout :'border',
    				defaults : {
    					collapsible :true,
    					split :true
    				},
    				items : [ treePanel, {
    					region :'center',
    					collapsible :false,
    					border:false,					
    					id:'py-permission-console-center',
    					layout:'fit'
    				} ]
    			});
    2)click handler:
    Code:
    onTreeClick:function(node,e){
    		switch(node.id){
    		case 'user':
    			var p = py.admin.permission.User.create({}).init();//Singleton instance
    			var centerPanel = this.panel.getComponent('py-permission-console-center');
    			this.util.displayPanel(centerPanel,p);
    			break;		
    		case 'function':
    			var p = py.admin.permission.Function.create({}).init();//Singleton
    			var centerPanel = this.panel.getComponent('py-permission-console-center');
    			this.util.displayPanel(centerPanel,p);
    			break;
    		default:
    			break;
    		}
    	}
    3)switch function
    Code:
    py.common.Util.displayPanel = function(cPanel, panel){	
    	var len = cPanel.items.items.length;
    	for ( var i = 0; i < len; i++) {
    		if (cPanel.items.items[i].id == panel.id) {
    			cPanel.items.items[i].setVisible(true);		
    		} else {
    			cPanel.items.items[i].setVisible(false);
    		}
    	}
    	if(!cPanel.getComponent(panel.id)){
    		cPanel.add(panel);
    	}
    	cPanel.doLayout();
    };
    In addition, I tried
    grid.syncSize();
    grid.ownerCt.syncSize();
    grid.ownerCt.ownerCt.syncSize();
    but none is useful.

  2. #2
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,892

    Default

    Looks like you'd be better off using a card layout. See API docs and examples.

  3. #3
    Sencha Developer
    Join Date
    Sep 2008
    Location
    Antioch, IL
    Posts
    1,516

    Default

    Rather than defining your panel like this:

    Code:
    items : [ treePanel, {
      region :'center',
      collapsible :false,
      border:false,
      id:'py-permission-console-center',
      layout:'fit'
    } ]
    ...why not create a default grid panel?

    Code:
    var defaultGridPanel = new Ext.grid.GridPanel({...});
    
    ...
    items : [ 
      treePanel, 
      defaultGridPanel 
    ]
    ...
    Then (based on the tree node which is clicked) use reconfigure() on your grid to swap columns and stores?

  4. #4

    Default

    Quote Originally Posted by arthurakay View Post
    Rather than defining your panel like this:

    Code:
    items : [ treePanel, {
      region :'center',
      collapsible :false,
      border:false,
      id:'py-permission-console-center',
      layout:'fit'
    } ]
    ...why not create a default grid panel?

    Code:
    var defaultGridPanel = new Ext.grid.GridPanel({...});
    
    ...
    items : [ 
      treePanel, 
      defaultGridPanel 
    ]
    ...
    Then (based on the tree node which is clicked) use reconfigure() on your grid to swap columns and stores?
    because actually two grid panel are different, such as buttons. i don't think i can just use reconfigure()

  5. #5
    Sencha Developer
    Join Date
    Sep 2008
    Location
    Antioch, IL
    Posts
    1,516

    Default

    You could also add multiple toolbars to the grid, and show/hide the appropriate one based on the node clicked.

  6. #6

    Default

    Quote Originally Posted by Animal View Post
    Looks like you'd be better off using a card layout. See API docs and examples.
    Well, maybe cardlayout is ok, but can you tell me why this is not ok? I guess this maybe relate with add/hide order?although I tired many times?, or container size changed after hide inner panel ...somthing must be wrong. no reason the first time is ok, the second time is wrong.

    Could you give more suggestion. thank you.

  7. #7

    Default

    Quote Originally Posted by arthurakay View Post
    You could also add multiple toolbars to the grid, and show/hide the appropriate one based on the node clicked.
    Yes, thank you, but i think it's seems more simple that use two different panel. I wanna try more.

Posting Permissions

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