PDA

View Full Version : How to sort tree at client side?



livinglegends
5 Oct 2010, 7:31 AM
Hi,

Is there any way to sort tree at client side using extjs?

As per requirement, I have to put two options below TreePanel.
My tree is like this


Root
Child 1
pqr
xyz
abc
Child 2
xyz
abc
pqrOptions are:
1. Sort by Name
2. Sort by Count

When user press on Sort by Name, all the nodes should be sorted by name and tree should be like below.



Root
Child 1
abc
pqr
xyz
Child 2
abc
pqr
xyzThat means, I dont want to sort Child 1 and Child 2.

livinglegends
5 Oct 2010, 8:10 AM
Hi,

Is there any way to sort tree at client side using extjs?

As per requirement, I have to put two options below TreePanel.
My tree is like this


Root
Child 1
pqr
xyz
abc
Child 2
xyz
abc
pqrOptions are:
1. Sort by Name
2. Sort by Count

When user press on Sort by Name, all the nodes should be sorted by name and tree should be like below.



Root
Child 1
abc
pqr
xyz
Child 2
abc
pqr
xyzThat means, I dont want to sort Child 1 and Child 2.

D

Condor
6 Oct 2010, 2:19 AM
Did you have a look at the API docs for Ext.tree.TreeSorter?

livinglegends
6 Oct 2010, 2:21 AM
Did you have a look at the API docs for Ext.tree.TreeSorter?

Yes...But it also do sorting of Child 1 and Child 2. I want to sort only leaf node.

Condor
6 Oct 2010, 2:25 AM
You will have to call treeSorter.doSort on each Child node separately.

livinglegends
6 Oct 2010, 2:27 AM
Let me explain my full scenario.

I have one tree as shown above and one combo box with two options 1. by name and 2. by count.

When user select any option, tree should get sorted.
How, to sort tree on selection change of combobox?

Because tree get sorted when any operation fire on node.

Please give me some code hint

Condor
6 Oct 2010, 2:32 AM
In that case you don't really need a TreeSorter, you just have to call sort(sortFn) on each child node from the combobox select event handler.

livinglegends
6 Oct 2010, 2:36 AM
what should I write in shortFn? what can be the parameter of it?

plz give me code?

Condor
6 Oct 2010, 2:40 AM
sortFn needs to be a function with two parameters (node1 and node2) that returns -1 if node1 should be before node2, 1 if node1 should be after node2 and 0 if the nodes are equal.

livinglegends
6 Oct 2010, 2:44 AM
How to compare text? I want it to sort alphabetically.

One more thing:
Each node has one attribute count. I want to sort tree by count also.

Condor
6 Oct 2010, 2:54 AM
Something like:

var sortByName = function(node1, node2){
var v1 = node1.text, v2 = node2.text;
if (v1 < v2) {
return -1;
} else if (v1 > v2) {
return 1;
}
return 0;
};
var sortByCount = function(node1, node2){
var v1 = node1.attributes.count, v2 = node2.attributes.count;
return v1 - v2;
};

livinglegends
6 Oct 2010, 2:56 AM
thanks condor...

I will try and let u know...u r really gr8