PDA

View Full Version : How to make Ext.tree.Panel as Floating



Hacker_Sallu
25 Oct 2011, 12:29 PM
I have leftPanel which is of Ext.tree.Panel having menu, I want to make is floatable so its always visible when scrolling the page.



this.leftPanel = Ext.create('Ext.tree.Panel', {
width:170,
padding:'0 20 0 40',
autoHeight:true,
/*floating:{parentEl:parent.body,constrain:true},
listeners: {
show: function(p){p.setPosition(p.x||10,p.y||10);}
},*/
//height:300,
//border:true,
cls:'mde-bubble-tree-node',
hideHeaders:true,
columns:[{
text: 'text',
flex: 1,
dataIndex: 'text',
sortable: false,
renderer:function(v,p,r){
if(r.data.status && r.data.status =='missing')
return '<font style="color:red">*</font>'+v;
else return v;
}
}
],
//bodyCls : 'mdecontainerLeft',
dockedItems : [{
xtype : 'panel',
border : false,
dock : 'top',
height : 50
//bodyCls : 'ufe-continue ufe-spider-bottom sprite'
}],
region:'west',
store: store,
//border:false,
rootVisible: false
});


When setting the floating as 'true', the menu is not visible at all in the page. I was putting a listener to grab the position when the panel is shown, but it given me undefined "length" issue.

If anyone has tried to create floating left panel, please let me know how you did it.

thanks in advance