Threaded View

  1. #1
    Ext JS Premium Member
    Join Date
    Sep 2009
    Posts
    59
    Vote Rating
    3
    wsi is on a distinguished road

      0  

    Default Answered: Tree node not expandable after appending children to it.

    Answered: Tree node not expandable after appending children to it.


    Function calls surrounding the creation of Tree Nodes and appending those nodes to a TreePanel do not work as expected. In the example below, I create three nodes: parent, child, grandchild. The relationships of the nodes are as the names suggests, the parent is the root, the child is the child, and the grandchild is a child of child. When I add the child to the parentNode I expect to be able to expand the parent and the child. If you run the example with EXTJS 4.1.1a or EXTJS 4.1.3 you find that this is not the case. The child can not be expanded.


    Code:
    Ext.define('Ext.data.ObjectTypeModel', {
        extend: 'Ext.data.Model',
        fields: [ { name: 'name', type: 'string' } ],
        proxy: {
            type: 'memory'
        }
    });
    
    
    var treeStore = Ext.create('Ext.data.TreeStore', {});
    
    
    var treePanel = Ext.create('Ext.tree.Panel', {
        title: 'Simple Tree',
        width: 200,
        height: 150,
        rootVisible: false,
        renderTo: Ext.getBody(),
        store: treeStore
    });
    
    
    //Get root node from the store
    var parentNode = treePanel.getStore().getRootNode();
    parentNode.removeAll(true);
    
    
    //Create child node
    var childNode = Ext.create('Ext.data.ObjectTypeModel', {});
    Ext.data.NodeInterface.decorate( childNode );
    childNode.set('text', "ChildNode");
    childNode.set('expandable', true );
    
    
    //Create grandchild node
    var grandchildNode = Ext.create('Ext.data.ObjectTypeModel', {});
    Ext.data.NodeInterface.decorate( grandchildNode );
    grandchildNode.set('text', "GrandChildNode");
    grandchildNode.set('expandable', true );
    
    
    //Append the nodes
    childNode.appendChild( grandchildNode );
    parentNode.appendChild( childNode );
    
    
    console.log( "Child node expandable?      " + childNode.isExpandable() );
    console.log( "Grandchild node expandable? " + grandchildNode.isExpandable() );

  2. You should decorate the model class not model instances. Try to fix your code as below:
    Code:
    Ext.define('Ext.data.ObjectTypeModel', {
        extend: 'Ext.data.Model',
        fields: [ { name: 'name', type: 'string' } ],
        proxy: {
            type: 'memory'
        }
    });
    
    
    Ext.data.NodeInterface.decorate( Ext.data.ObjectTypeModel );
    
    
    var treeStore = Ext.create('Ext.data.TreeStore', {});
    
    
    var treePanel = Ext.create('Ext.tree.Panel', {
        title: 'Simple Tree',
        width: 200,
        height: 150,
        rootVisible: false,
        renderTo: Ext.getBody(),
        store: treeStore
    });
    
    
    //Get root node from the store
    var parentNode = treePanel.getStore().getRootNode();
    parentNode.removeAll(true);
    
    
    //Create child node
    var childNode = Ext.create('Ext.data.ObjectTypeModel', {});
    //Ext.data.NodeInterface.decorate( childNode );
    childNode.set('text', "ChildNode");
    childNode.set('expandable', true );
    
    
    //Create grandchild node
    var grandchildNode = Ext.create('Ext.data.ObjectTypeModel', {});
    //Ext.data.NodeInterface.decorate( grandchildNode );
    grandchildNode.set('text', "GrandChildNode");
    grandchildNode.set('expandable', true );
    
    
    //Append the nodes
    childNode.appendChild( grandchildNode );
    parentNode.appendChild( childNode );
    
    
    console.log( "Child node expandable?      " + childNode.isExpandable() );
    console.log( "Grandchild node expandable? " + grandchildNode.isExpandable() );

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar