View Full Version : Problem: Mixing of structure and state information in treenodes

6 Apr 2014, 3:34 AM
Use case:

Assume, you have a address store and a category treestore. Each treenode in the treestore has the checked attribute. The treestore is used in two treepanels (A and B)

The checkbox nodes in Treepanel A are for assigning one or more categories to one address.

The checkbox nodes in Treepanel B are for filtering the address store by category.

If I now expand or check a node in one treepanel, the same action is repeated in the other treepanel. See also http://dev.sencha.com/ext/5.0.0/examples/kitchensink/?theme=classic#basic-trees.

That is bad. The Treepanels should share the tree structure but not the tree state.

My workaround is to create a copy of the category store and use this copy in treepanel B. The problem is now: if I change the tree structure (getting, adding, removing, renaming or moving nodes) in one treestore, I have to write application code to keep the data in the treestore copy in sync. This is bad too.

Please take the chance in this major version and move the tree state information from the treenode to the treeview or find another clever fix.


6 Apr 2014, 4:01 AM
Does this actually work this way?

I'd think this is not possible since a tree store can be assigned only to a single tree panel (?).

There's 1-to-1 binding (tree store to tree panel), but other stores can back up multiple components

Store has knowledge of the tree, so it must be used on a single tree panel.

Ext.define('Ext.tree.Panel', {
bindStore: function(store, initial) {
// TreeStore must have an upward link to the TreePanel so that nodes can find their owning tree in NodeInterface.getOwnerTree
store.ownerTree = me;

See also this thread (http://www.sencha.com/forum/showthread.php?280993-Nightly-Tree-panel-question&p=1027456&viewfull=1&langid=4).

7 Apr 2014, 5:40 AM
Ext JS 5 has introduced Ext.data.ChainedStore which is "a store that is a 'view' of an existing store. The data comes from the source, however this view of the store may be sorted & filtered independently without having any impact on the source store."


I think the concept of a chained store will solve your issue. Except I don't think that ChainedStore will work with a tree panel as it is not a TreeStore and is missing some of the required methods.

Ext.data.ChainedTreeStore anyone ?

8 Apr 2014, 3:45 PM
A TreeStore can only be used in one tree really.

The nodes themselves (as you would expect in a tree structure) carry parent, sibling, child and other state information. If you used a TreeStore in multiple trees, they would all be in the same state.

We use this to demonstrate the styling possibilities for trees in this example which uses one store and three trees: http://dev.sencha.com/ext/5.0.0/examples/kitchensink/#basic-trees

19 Sep 2014, 6:39 AM
Ext.data.ChainedTreeStore anyone ?

This would be awesome. The example that Animal points to is kind of nice.

I have a use case where I have a multi-level tree that I need to burst into separate treepanels on one page and then grab small bits of and present in other treepanels on other panels. In my use case I don't particularly care if the state is common between these trees (though I guess selection might be a different matter). If a change is made in the underlying data it would ideally be reflected in places the store is used.

I actually have a use case where I also want to have various nodes of a tree-store appear in a non-tree grid (these nodes all have a common selection criteria - the presence of a particular value). If I update the underlying treestore I want the grid to be updated too - just like a chained store.

So, ChainedTreeStore - yes please. Also the ability to chain a regular store from a TreeStore.

I can dream can't I?