Is there a way to show only parent nodes in extjs tree

Question

I want to show only the parent tree nodes in extjs. My repository also has leaf nodes.

The output should be like -

  Folder 1
    Folder 1.1
 Folder 2
 Folder 3

Answer 1

Create a filter object that receives only the parent nodes and adds it to the storage configuration:

eg. filter for parent nodes only:

var nodeFilter = new Ext.util.Filter({ property: 'leaf', value : false }); 

Put it in the treestore configuration:

 var yourTreeStore = Ext.create('Ext.data.TreeStore', { // other configs ... filters: [nodeFilter] }); 

EDIT:

incutonez is right, I sent according to the properties of the API, but did not notice the missing functions. They are light enough to override, although apply filtering to the treestore. This works for me in 4.1b2:

 Ext.override(Ext.data.TreeStore, { hasFilter: false, filter: function(filters, value) { if (Ext.isString(filters)) { filters = { property: filters, value: value }; } var me = this, decoded = me.decodeFilters(filters), i = 0, length = decoded.length; for (; i < length; i++) { me.filters.replace(decoded[i]); } Ext.Array.each(me.filters.items, function(filter) { Ext.Object.each(me.tree.nodeHash, function(key, node) { if (filter.filterFn) { if (!filter.filterFn(node)) node.remove(); } else { if (node.data[filter.property] != filter.value) node.remove(); } }); }); me.hasFilter = true; }, clearFilter: function() { var me = this; me.filters.clear(); me.hasFilter = false; me.load(); }, isFiltered: function() { return this.hasFilter; } }); 

Using this override in your code, you can create a “sheet only” filter as a function or a pair of properties / values ​​according to the Ext.util.Filter API:

 // leaf only filter as a property/value pair var nodeFilter = new Ext.util.Filter({ property: 'leaf', value : false }); // leaf only filter as a function var nodeFilter = Ext.create('Ext.util.Filter', { filterFn: function(item) { return !item.data.leaf; } }); 

Then you can simply call the filter function whenever you take out leaf nodes:

 myTreeStore.filter(nodeFilter); 

Answer 2

TreeStores do not inherit filtering (because they are abstract stores), so Geronimo's answer didn't work for me. I would like this to happen, because it would make my life easier.

Anyway, I have thread on the Sencha forums, which provides a working filtering solution. In my example, filtering is called by the filterBy function, so I'm sure you can configure it to work in your way.