PDA

View Full Version : removeAll() not working with dockedItems in Grid



roykrish
3 Feb 2012, 7:57 PM
Hi,

In a border layout I am trying to load a grid panel in the center region, dynamically. I have a toolbar in the 'east' region and a button in that toolbar, 'List of Projects'. When I hit that button first time it loads the grid properly in center region. When I hit 2nd or 3rd time it does not render the UI properly.

My Grid panel has a docked item which contains the paging toolbar. If I remove that dockedItem everything works fine. Problem starts when I include that docked item.

Event listener for "List Of Projects" button --

handler: function(){
var content = Ext.getCmp('portal-container');
content.removeAll();
content.add(Ext.ComponentMgr.create({
itemId: 'projectlist',
xtype: 'proectjlist',
border: true
}));
}

It seems content.removeAll() doesn't work proeprly if there is a dockedItem present in the Grid Panel. What am I doing wrong ?

Please Help.

Thank You

mitchellsimoens
4 Feb 2012, 6:18 AM
What version are you using as this simple testcase works fine:


new Ext.container.Viewport({
layout : 'border',
items : [
{
region : 'center',
layout : 'fit',
items : [
{
xtype : 'panel',
dockedItems : [
{
xtype : 'toolbar',
dock : 'bottom',
items : [
{
text : 'Test'
}
]
}
]
}
]
},
{
region : 'east',
width : 400,
dockedItems : [
{
xtype : 'toolbar',
dock : 'top',
items : [
{
text : 'Remove',
handler : function(btn) {
var viewport = btn.up('viewport'),
center = viewport.down('container[region=center]');

center.removeAll();
}
}
]
}
]
}
]
});

roykrish
4 Feb 2012, 9:45 PM
Thank you very much for replying.

The version I am using is 4.0.7.

I am new with Sencha, and probably that is stopping me from understanding the solution. My border layout is present in my controller and looks like this..


items: [
{
region: 'north',
xtype : 'paasactions',
flex: 1,
height: '7%'
},
{
xtype : 'navigation',
region: 'west',
flex: 1,
width: '12%',
border:true
},
{
id: 'portal-container',
xtype: 'overview',
region: 'center',
layout: 'fit',
flex: 1,
width: '88%',
border:false,
autoscoll:true
}
]


In one of my views I have Grid panel and the docked item(paging toolbar) is a part of that Grid Panel. I click a button, present in my toolbar(present in the north region) to load that Grid panel into the center region. The problem is If I hit the button 2nd time, the screen doesn't show up properly. When I hit that button it gets a handle on that center region and calls removeAll() for that region.
When I hit the button first time to load the Grid, there is only a simple panel at the center region. removeAll() works pretty fine that time. 2nd time when I hit the button then the Grid is already there with the docket item. Then removeAll() doesn't work proeprly.

What am I doing wrong here ?

lmanik
5 Feb 2012, 12:06 AM
Hi, I have got same problem http://www.sencha.com/forum/showthread.php?178592-Problem-with-dockedItems