mercredi 11 juin 2014

ExtJs 5: TreePanel: Not getting the default leaf icons and lines

I created a sample TreePanel using Sencha ExtJs 5. I followed the sample example in the documentations and I am able to see the items (leaves and branches) but they are not coming as a Tree, but as a list.

Here is my code:

Store:


Code:



Ext.define('MyApp.store.ResourcesStore',
{extend : 'Ext.data.TreeStore',
root : {
expanded : true,
children : [ {
text : "UI Forms",
leaf: false,
expanded : true,
children : [ {
text : "Web",
leaf : true
}, {
text : "Smart Phone",
leaf : true
}, {
text : "Tablet",
leaf : true
} ]
}, {
text : "Reports",
leaf : true
}, {
text : "Dashboards",
leaf : true
}, {
text : "Entities",
leaf : true
}, {
text : "Queries",
leaf : true
}, {
text : "Services",
leaf : true
}
]}});


View:



Code:



Ext.define('MyApp.view.leftpanel.ResourcesView', {
extend : 'Ext.TreePanel',
xtype : 'resources-panel',
title : 'Resources',
store : 'ResourcesStore',
rootVisible : false
});

Here is what my output looks like:

v33im.png





2 commentaires:

  1. Same problem... do you find a way to fix it?

    RépondreSupprimer
  2. There is a good chance that the treepanel requires de "id" property of its nodes to assemble the tree correctly.

    root : {
    expanded : true,
    id: "root" , <------------
    children : [ {
    text : "UI Forms",
    leaf: false,
    id: "root/ui", <------------
    expanded : true,
    children : [ {
    text : "Web",
    leaf : true
    id : "root/ui/web", <------------
    }, {
    text : "Smart Phone",
    leaf : true
    id : "root/ui/smart" <------------

    RépondreSupprimer