Jump to content

TUniDBTreeGrid - Make selected row expanded


arilotta

Recommended Posts

Hi, I know it is possible to fully expand/collapse a UniDBTreeGrid.

What I'm trying to achieve is to only expand the branch that contains the selected record.

Looking at Sencha documentation, it seems there is the "expand" method, so I've tried something like this:

 

UniDBTreeGrid1.JSInterface.JSCall('expand', ['key id', true]);

 

Unfortunately, it doesn't work. Any ideas ?

Link to comment
Share on other sites

  • Administrators
type
  THUniDBTreeGrid  = class(TUniDBTreeGrid);

procedure TMainForm.UniButton2Click(Sender: TObject);
var
  JSStore : TJSObject;
  RNo : Integer;
begin
  JSStore := (UniDBTreeGrid2 as IUniJSObjects).JSObjects.Objects['store'];

  RNo := THUniDBTreeGrid(UniDBTreeGrid2).RecordNo;

  with UniDBTreeGrid2.JSInterface do
  begin
    JSCode('var node='#1'.getNodeById('+IntToStr(RNo)+');', JSStore);
    JSCallGlobal('if(node)node.expand', [True]);
  end;
end;


Above code works when TreeGrid rows have Parent/Child relation.

Link to comment
Share on other sites

Hi,

 

Also you can try to use this approach:

 

1. UniDBTreeGrid1 ->

function beforeInit(sender, config)
{
    var me = sender;
    me.expandSelectedNode = function() {
        var _selection = me.getSelectionModel().getSelection()[0];
        if (_selection) {
            var _expanded = _selection.get('expanded');

            if (!_expanded) {
                me.expandNode(_selection);
            }
        }
    };
}

2.

procedure TMainForm.UniButton1Click(Sender: TObject);
begin
  UniDBTreeGrid1.JSInterface.JSCall('expandSelectedNode', []);
end;

Best regards,

Link to comment
Share on other sites

Hi, I've tried the 2nd solution, and it works, but I would like to expand the branch all the way up starting from the selected node.
The supplied code expands just the selected node.
 
I've tried somethign like this, trying to get the parent node, and expand it, but it didn't work:
 

function beforeInit(sender, config)
{
    var me = sender;
    me.expandSelectedNode = function() {
        var _selection = me.getSelectionModel().getSelection()[0];
        if (_selection) {         
          var _parent = _selection.get('parentNode');
          if(_parent) {           
          _parent.set('expanded', 'true');

          };
        };          
    };
}

Link to comment
Share on other sites

Hi,

 

but I would like to expand the branch all the way up starting from the selected node.
The supplied code expands just the selected node.

 

Can you try this ?:

function beforeInit(sender, config) 
{
    var me = sender;
    me.expandSelectedNode = function() {
        var _selection = me.getSelectionModel().getSelection()[0];
        if (_selection) {
            _selection.cascadeBy(function(node) {
                node.expand();
            })
        }
    };
}

Best regards,

Link to comment
Share on other sites

Thank you, your solution fully expands a branch from a starting node, but I need to go up the tree and expand the parents rather than the children.

On the Sencha documentation, I found the function "bubble" that should do the trick.

Unfortunately, if I substitute "cascadeBy" with "bubble" and an hidden node is selected, it doesn't work.

Let me explain a bit more my problem.

I have a hierarchical query bound to a TUniDbTreeGrid; when I open the form the tree is fully collapsed; then I change the

active record on the query by code using a Locate. If the new active record is not on the root level, and it is a child, and the tree

is collapsed, I need that node to be expanded, in order to have the selection visible.

I really appreciate the time you are spending with me.

Thanks

 
Link to comment
Share on other sites

Ok, I shared the tets case on Google Drive. Please download the test case from the following link:

 


 

Steps to reproduce the issue:

1. Click "1. Fill dataset" to populate the dataset

2. Click "2. Locate root" to move the active record to the root

3. Click "Expand Selected Node" to expand it --> it works

 

4. Click "FullCollapse"

5. Click "3. Locate Child1" to move the active record to Child1

6. Click "Expand Selected Node" to expand it --> doesn't work, nothing happens

 

Repeat steps 4..6 changing the node to locate, locating GrandChild1 and then GrandChil3:

same behaviour the node is not made visible.

 

If I change "cascadeBy" with "bubble", strangely, the behaviour is the same.

 

Thank you
Link to comment
Share on other sites

Hi,

 

Can you try this approach for now ?!:

 

1. MainForm -> Script:

Ext.tree.Panel.addMembers({
    selectPathById: function(id){
        var me = this,
            node = me.getStore().getNodeById(id);
        if(node){
            me.selectPath(node.getPath());
        }
    }
});

2. and use, for example:

procedure TMainForm.UniButton3Click(Sender: TObject);
begin
  CDS.Locate('id', 2, []);
  //GRD.JSInterface.JSCall('expandSelectedNode', []);
  GRD.JSInterface.JSCall('selectPathById', [2-1]); 
end; 

...

Best regards,

Link to comment
Share on other sites

Thank you Delphi Dev,

it works using the "selectPathById" function. It is necessary to know in advance the node ID, and it is somehow tricky to get that value.

However I managed to get that value directly from the query (using Oracle). For anyone that's interested in, the node index ranges

from zero to N-1 (number of nodes minus 1).

The first root node gets a 0 index, the second root node a 1 index, ...

The first node at level 1 (child of a root node) gets a J index, given J the number of root nodes, and so on

Maybe clearer with an example:

 

N1                                                               Index 0

         N11                                                    Index 3

         N12                                                    Index 4

N2                                                               Index 1

         N21                                                    Index 5

         N22                                                    Index 6

N3                                                               Index 2

         N31                                                    Index 7

                     N311                                      Index 9

                     N312                                      Index 10

         N32                                                    Index 8

Link to comment
Share on other sites

  • 7 months later...

Thank you Delphi Dev,

it works using the "selectPathById" function. It is necessary to know in advance the node ID, and it is somehow tricky to get that value.

However I managed to get that value directly from the query (using Oracle). For anyone that's interested in, the node index ranges

from zero to N-1 (number of nodes minus 1).

The first root node gets a 0 index, the second root node a 1 index, ...

The first node at level 1 (child of a root node) gets a J index, given J the number of root nodes, and so on

Maybe clearer with an example:

 

N1                                                               Index 0

         N11                                                    Index 3

         N12                                                    Index 4

N2                                                               Index 1

         N21                                                    Index 5

         N22                                                    Index 6

N3                                                               Index 2

         N31                                                    Index 7

                     N311                                      Index 9

                     N312                                      Index 10

         N32                                                    Index 8

Solution :

Re build your UnitreeView by sorting your Dataset : Order by AbsoluteIndex

(This is Jscript problem. Not unigui)

http://forums.unigui.com/index.php?/topic/9793-treeview-order/&do=findComment&comment=51912

Link to comment
Share on other sites

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...