Results 1 to 3 of 3

Thread: TreePanel with associated models just shows the main model

  1. #1
    Sencha User
    Join Date
    Nov 2011
    Location
    Germany
    Posts
    5

    Default TreePanel with associated models just shows the main model

    Hi,
    i'm trying do display the data from 2 associated stores in a tree panel. But the problem is that the items from the second store aren't displayed. Here are the relevant code snippets

    The main model, it can have several fragmants which should be displayed as subfolders.
    Code:
    Ext.define('app.model.Main', {
        extend : 'Ext.data.Model',
        fields : [{
            name : 'id',
            type : 'int'
        }, {
            name : 'text',
            type : 'string'
        }],
        hasMany : {
            model : 'app.model.Fragment',
            name : 'fragments',
            autoload: true
        }
    });

    Code:
    Ext.define('app.store.Main', {
        extend : 'Ext.data.TreeStore',
        model: 'app.model.Main',
        proxy: {
            type: 'memory',        
            reader: {
                type: 'json',
                root: 'root'
            }
        },
    
        root : {
            expanded : true,
            text : 'root'
        }
    });
    The model for the fragments which aren't displayed
    Code:
    Ext.define('app.model.Fragment', {
        extend: 'Ext.data.Model',
        fields: ['id', 'main_id', 'text'],
        belongsTo: 'app.model.Main'
    });
    In the view theres a button to add a new chapter. On a click the chapter is added and the fragment is added to the main model to but it's not displayed in the tree.
    Code:
    Ext.define('app.view.TreePanel', {
        extend : 'Ext.tree.Panel',
        alias : 'widget.treepanel',
    
        store : 'StoreA',
      ....
    
        displayField : 'text',
    
        initComponent : function() {
            this.dockedItems = [{
                dock : 'top',
                xtype : 'toolbar',
                items : [{
                    xtype : 'button',
                    text : 'Add',
                    action : 'add'
                }]
            }]
            this.callParent();
        }
    });
    Here is the part i add the new chapter to the model. First i create the fragment then a new chapter. Afterwards the fragment is added to the chapter and all together is appended to the selected node.
    Code:
    Ext.define('app.controller.Main', {
        extend : 'Ext.app.Controller',
    ....
        onAdd : function() {
            var fragment = Ext.create('app.model.Fragment', {
                id: 300,
                main_id: this.count,
                text: 'test'
            });
            var main = Ext.create('app.model.Main', {
                id: this.count,
                text : 'Chapter ' + this.count++,
            });
            main.fragments().add(videoFragment);
            var chaptersList = this.getChaptersList();
            var selection = chaptersList.getSelectionModel().getSelection();
            selection[0].appendChild(main);
            selection[0].expand();
        }
    });
    As i said the model seems to be working fine. All fragments are added to it's corresponding chapters, but they aren't displayed in the treepanel.
    Am I missing something?

  2. #2
    Ext JS Premium Member tvanzoelen's Avatar
    Join Date
    Apr 2008
    Location
    Groningen - Netherlands
    Posts
    1,199
    Answers
    87

    Default

    What I know, this is not supported yet. You can only have one model for the tree client side.

  3. #3
    Sencha User
    Join Date
    Nov 2011
    Location
    Germany
    Posts
    5

    Default

    hmm ok,
    i solved this no in the way that i add new text nodes to the tree and the rest of the data will be coverd by the other stores.. not the solution i expected but it works...

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •