Question

I have a tree and a combo box.

1. I need to get the immediate children of node 1 and place them in the combo box.

2. When a node is selected from the combo box list, the tree should display only that node and its children.

Basically, the combo box serves as a filter to show only a specific node. All the nodes except from the selected one are hidden.

Any help will be appreciated.

Answer 1

Look up the filtering functionality in Ext JS API documentation. On the top-left “Find a Class” you get to filter the tree by an input string. I think what you want to do is quite similar to that:

http://dev.sencha.com/deploy/dev/docs/

Scroll down to filterTree function in:
http://dev.sencha.com/deploy/dev/docs/resources/docs.js

filterTree: function(t, e){
    var text = t.getValue();
    Ext.each(this.hiddenPkgs, function(n){
        n.ui.show();
    });
    if(!text){
        this.filter.clear();
        return;
    }
    this.expandAll();

    var re = new RegExp('^' + Ext.escapeRe(text), 'i');
    this.filter.filterBy(function(n){
        return !n.attributes.isClass || re.test(n.text);
    });

    // hide empty packages that weren't filtered
    this.hiddenPkgs = [];
        var me = this;
    this.root.cascade(function(n){
        if(!n.attributes.isClass && n.ui.ctNode.offsetHeight < 3){
            n.ui.hide();
            me.hiddenPkgs.push(n);
        }
    });
},