PDA

View Full Version : Tree panel not expanding properly in IE8/9.



kavyakn
31 Jul 2012, 3:34 AM
Tree panel is not expanding smoothly in IE browsers. Can you suggest some solution ?

sword-it
31 Jul 2012, 4:13 AM
Hi,

tyr following code:




var store = Ext.create('Ext.data.TreeStore', {
root: {
expanded: true,
children: [
{ text: "detention", leaf: true },
{ text: "homework", expanded: true, children: [
{ text: "book report", leaf: true },
{ text: "alegrbra", children:[
{ text: "book report", leaf: true },
{ text: "book report", leaf: true },
{ text: "book report", leaf: true }
]}
] },
{ text: "buy lottery tickets", leaf: true }
]
}
});


var tree =Ext.create('Ext.tree.Panel', {
title: 'Simple Tree',
width: 200,
height: 250,
store: store,
tbar:[
{
text:'Expand All'
,handler:function(){
tree.expandAll();
}
},
{
text:'CollapseAll'
, handler:function(){
tree.collapseAll();
}
}
],
rootVisible: false,
renderTo: Ext.getBody()
});

kavyakn
31 Jul 2012, 11:03 PM
Tried but still the expansion is not smooth in ie .as shown below.
http://www.sencha.com/forum/attachment.php?attachmentid=36621&d=1340880279

kavyakn
2 Aug 2012, 8:34 PM
This is the code :
tree.setRootNode({
text:'Root'
,id:'Root:1'
,expanded:true
,qtip:'Root'






});
/* get root node instance*/
var root = tree.getRootNode();
group_1= root.appendChild({
text: 'Group 1'
,expanded: false
,qtip:'Group 1'


});


var group1_store= Ext.getStore('Group_1_Store');
group1_store.load({
scope : this,
callback: function(records, operation, success) {
//the operation object contains all of the details of the load operation
Ext.ComponentQuery.query('myTreePanel')[0].getSelectionModel().select(0);
Ext.Array.each(records, function(record, index, records) {


if(!(record.get('name')==='')){


group_1 .appendChild({
text: record.get('name')
,leaf:true
,qtip:record.get('name')


});
}


});
group_1.expand();
}
});



group_2= root.appendChild({
text: 'Group 2'
,expanded: false
,qtip:'Group 2'




});


var group2_store= Ext.getStore('Group_2_Store');
group2_store.load({
scope : this,
callback: function(records, operation, success) {
//the operation object contains all of the details of the load operation
Ext.ComponentQuery.query('myTreePanel')[0].getSelectionModel().select(0);
Ext.Array.each(records, function(record, index, records) {
if(!(record.get('name')=== '')){
group_2.appendChild({
text: record.get('name')
,leaf: true
,qtip:record.get('name')
});
}
});
group_2.expand();
}
});