I have a textfield in my tree toolbar that should take a string from a user then search that through a specific column of tree. I use store filter but there is a problem in my code and I dont know what it is. thanks for help. This is my code:

var onSimpleSearch = function(){
 var searchStr= Ext.getCmp('searchField').getValue();
   if(searchStr){
    var tree = Ext.getCmp('infra_tree');
    var tstore = tree.getStore();
    var searchReg = new RegExp(".*" + searchStr + ".*", "ig");
    console.log(searchReg); //return RegExp!!!!!!!
    tstore.filter("ipadd", searchReg});
}else {
    Ext.MessageBox.show({
        title: 'Nothing to search',
        msg: 'Search string is empty',
        icon : 'ext-mb-info',
        buttons: Ext.MessageBox.OK
    });
  }
};

I have a textfield in my tree toolbar that should take a string from a user then search that through a specific column of tree. I use store filter but there is a problem in my code and I dont know what it is. thanks for help. This is my code:

var onSimpleSearch = function(){
 var searchStr= Ext.getCmp('searchField').getValue();
   if(searchStr){
    var tree = Ext.getCmp('infra_tree');
    var tstore = tree.getStore();
    var searchReg = new RegExp(".*" + searchStr + ".*", "ig");
    console.log(searchReg); //return RegExp!!!!!!!
    tstore.filter("ipadd", searchReg});
}else {
    Ext.MessageBox.show({
        title: 'Nothing to search',
        msg: 'Search string is empty',
        icon : 'ext-mb-info',
        buttons: Ext.MessageBox.OK
    });
  }
};

• javascript
• extjs

Share Improve this question Follow edited Oct 8, 2011 at 13:30 Matt Stone asked Oct 8, 2011 at 6:39 Matt StoneMatt Stone 4122 silver badges44 bronze badges 3

• debug it. if you replace searchReg in the filter() call with a hard coded value, does it work? – Amol Katdare Commented Oct 8, 2011 at 14:40
• I did, It doesnt, I think there is no implementing for tree store filter, it is fake! what should i do now? how to filter my data in store? :( – Matt Stone Commented Oct 9, 2011 at 6:16
• This thread shows some more background, but not yet a working implementation: sencha./forum/… – Tim Commented Jun 20, 2012 at 14:32

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

There is no filter method in Ext.data.TreeStore (assuming you are using 4.x, I am using 4.1.3). Maybe this will help you: Ext JS 4: Filtering a TreeStore

Alternatively, you could try something like this:

var nodeToSearchFor = treestore.getRootNode().findChildBy(function(node) {
    return (node.data['fieldToSearchFor'] == valueToSearchFor);
});

And hopefully one last edit :-) In this thread in the Sencha forums, they are suggesting you use CascadeBy on the root node. Works same way as the code above more or less.

http://www.sencha./forum/showthread.php?150060-Search-inside-extjs-tree-store

You could walk over all child nodes in the tree instead of going through the store. All nodes of the tree implement the TreeNodeInterface which has the methods you need. The cascadeBy method is probably what you are looking for. It will call a function recursively on each child node of a node. That is essentially the same as a filter for a store, but it knows about the hierarchy of the tree.

var searchStr = Ext.getCmp('searchField').getValue();
var matchingNodes = [];

var tree = Ext.getCmp('infra_tree'); 
// You could get the selected node, or any other node as start node.
// I take the root node as example.
var startNode = tree.getRootNode();

startNode.cascadeBy(function (childNode) {
    if (childNode.get('text') == searchStr)
    {
       matchingNodes.push(childNode);
    }
}, this);

You could search any other field in childNode as well obviously. Usually I the nodes I keep in trees have a different model in them. If I have a teacher model that is displayed in a tree I have a teacherTreeModel that has a teacher. So the teacher tree model is not saved in database, only the teacher model. Found that to be easier in many cases.

I had the same questions and I just found a fiddle that solves the "search in a tree store" problem. I don't know who wrote it, but it's a gem. It is running here: https - add colon slash slash - fiddle.sencha./#fiddle/ra&view/editor (I tried to include the source code from the fiddle here into the answer, but the Stack Overflow editor doesn't allow me.)