Jump to content

Scroll TreeView So Selected Node Visible

mos

By mos
in General

 Share

Recommended Posts

mos Advanced Member

mos

Posted
Posted

At runtime I am setting the selected node however this node maybe not be in the visible area of the treeview as the treeview may contains a lot of items.

 

How can I scroll the treeview so the selected node is visible?

  • 2 years later...
Nadya Member

Nadya

Posted
Posted

Hello!

I use UniGUI 1.90.0.1531 and I have similar problem with TUniDBTreeGrid. For example, I have a grid:

StructureGrid: TUniDBTreeGrid;

In UniFormShow event I assign for it this method:

    StructureGrid.ClientEvents.UniEvents.Values['beforeInit'] := 'function beforeInit(sender, config) {' +
                                                         '  var me = sender;' +
                                                         '    me.expandSelectedNode = function() {' +
                                                         '        var _selection = me.getSelectionModel().getSelection()[0];' +
                                                         '        if (_selection) {' +
                                                         '            _selection.cascadeBy(function(node) {' +
                                                         '                node.expand();' +
                                                         '            })' +
                                                         '        }' +
                                                         '    };' +
                                                         '}';

When i search for value in underlying dataset, I call:

StructureGrid.JSInterface.JSCall('expandSelectedNode', []);

The row I was searchive for is selected but the grid doesn't scroll to it. So it remains out of the visible area.

Please, tell me, what am I doing wrong?

 

 

Sherzod Advanced Member

Sherzod

Posted
Posted
32 minutes ago, Nadya said:

I use UniGUI 1.90.0.1531

Hello Nadya,

Are you using a trial edition?

In addition, this code may help you: 

grid.ensureVisible(grid.getSelection()[0]);

 

Nadya Member

Nadya

Posted
Posted
37 minutes ago, Sherzod said:

Hello Nadya,

Are you using a trial edition?

In addition, this code may help you: 


grid.ensureVisible(grid.getSelection()[0]);

Sherzod, I use trial version now, buying license is in progress. 

Thank you for attention and I'm very sorry for stupid questions, but do I get it write, I should change method this way?

function beforeInit(sender, config) {
  var me = sender;
    me.expandSelectedNode = function() {
        var _selection = me.getSelectionModel().getSelection()[0];
        if (_selection) {
            _selection.cascadeBy(function(node) {
                node.expand();
            });
            sender.ensureVisible(sender.getSelection()[0]);            
            -- OR maybe one of the following variants?
            -- sender.ensureVisible(sender.getSelectionModel().getSelection()[0]);            
            -- sender.ensureVisible(_selection);            
        }
    };
}

Sherzod Advanced Member

Sherzod

Posted
Posted

Nadya, thank you for your interest in UniGUI.

5 minutes ago, Nadya said:

I'm very sorry for stupid questions, but do I get it write, I should change method this way?

Np, yes. Have you tried checking with this?

Nadya Member

Nadya

Posted
Posted
10 minutes ago, Sherzod said:

Np, yes. Have you tried checking with this?

Yes, but it doesn't help :(

I assign this method on UniFormShow this way

    StructureGrid .ClientEvents.UniEvents.Values['beforeInit'] := 'function beforeInit(sender, config) {' +
                                                         '    var me = sender;' +
                                                         '    me.expandSelectedNode = function() {' +
                                                         '        var _selection = me.getSelectionModel().getSelection()[0];' +
                                                         '        if (_selection) {' +
                                                         '            _selection.cascadeBy(function(node) {' +
                                                         '                node.expand();' +
                                                         '            });' +
                                                         '            sender.ensureVisible(sender.getSelection()[0]);' +
                                                         '        }' +
                                                         '    };' +
                                                         '}';

Node is selected but still out of visible area :-(

Nadya Member

Nadya

Posted
Posted
30 minutes ago, Sherzod said:

OK, 

Can you provide part of your code? 

Ohh, that would not be easy :-) Would it be ok, if I  just print a part of source code and some descriptions?

DataSet: qrData: TADOQuery;
Fields:
qrDataID: TLargeintField
qrDataParentID: TLargeintField
qrDataLevelNode: TIntegerField
qrDataCurrentName: TStringField

DataSource: dsData: TDataSource (linked to qrData)

StructureGrid: TUniDBTreeGrid;
Properties (differs from default):
Columns: CurrentName, LeveNode(Visible = False), ID(Visible = False)
BorderStyle = ubsNone
DataSource = dsData
IDField = ID
IDParentField = ParentID
Options (differs from default) = Editing = False, Titles = False, ColLines = False, RowLines = False
UseArrows = True

When user enters the search key in beSearchNode, FindStructureNode launches.


procedure TfmPlan.FindStructureNode;
var
    tmpCriteria: WideString;
begin
    if Trim(beSearchNode.Text) = ''
    then
        Exit;

    tmpCriteria := '';

    tmpCriteria := 'CurrentName LIKE ''%' + Trim(beSearchNode.Text) + '%''';

    FindInQuery(tmpCriteria, qrData);

    StructureGrid.JSInterface.JSCall('expandSelectedNode', []);
end;

function TfmPlan.FindInQuery(SearchCriteria: WideString; qrSource: TADOQuery): Boolean;
var
    tmpRecord: Integer;
begin
    Result := False;

    if (qrSource.Recordset.RecordCount = 0) or (Trim(SearchCriteria) = '') then
        Exit;

    tmpRecord := qrSource.RecNo;

    qrSource.Recordset.Find(SearchCriteria, 1, adSearchForward, qrSource.Recordset.Bookmark);

    if qrSource.Recordset.Eof = False  then
    begin
        qrSource.RecNo := qrSource.Recordset.AbsolutePosition;
        Result := True;
    end
    else
    begin
        qrSource.First;
        qrSource.Recordset.Find(SearchCriteria, 0, adSearchForward, qrSource.Recordset.Bookmark);

        if qrSource.Recordset.Eof = False then
        begin
            qrSource.RecNo := qrSource.Recordset.AbsolutePosition;
            Result := True;
        end
        else
            qrSource.RecNo := tmpRecord;
    end;
end;

procedure TfmPlan.UniFormShow(Sender: TObject);
begin
    StructureGrid.ClientEvents.UniEvents.Values['beforeInit'] := 'function beforeInit(sender, config) {' +
                                                         '    var me = sender;' +
                                                         '    me.expandSelectedNode = function() {' +
                                                         '        var _selection = me.getSelectionModel().getSelection()[0];' +
                                                         '        if (_selection) {' +
                                                         '            _selection.cascadeBy(function(node) {' +
                                                         '                node.expand();' +
                                                         '            });' +
                                                         '            sender.ensureVisible(sender.getSelection()[0]);' +
                                                         '        }' +
                                                         '    };' +
                                                         '}';
end;

Sherzod Advanced Member

Sherzod

Posted
Posted
24 minutes ago, Nadya said:

    FindInQuery(tmpCriteria, qrData);

    StructureGrid.JSInterface.JSCall('expandSelectedNode', []);

Can you try this approach? 

  ...
  FindInQuery(tmpCriteria, qrData);
  StructureGrid.JSInterface.JSCall('expandSelectedNode', []);
  StructureGrid.JSInterface.JSCode('Ext.defer(function(){'#1'.ensureVisible('#1'.getSelection()[0])}, 200);'); //<-----
  ...

 

  • Upvote 1
Nadya Member

Nadya

Posted
Posted
4 minutes ago, Sherzod said:

Can you try this approach? 


  ...
  FindInQuery(tmpCriteria, qrData);
  StructureGrid.JSInterface.JSCall('expandSelectedNode', []);
  StructureGrid.JSInterface.JSCode('Ext.defer(function(){'#1'.ensureVisible('#1'.getSelection()[0])}, 200);'); //<-----
  ...

It works!!! Thank you very very much!

  • Like 1
Nadya Member

Nadya

Posted
Posted

By the way may I ask a question about JS scripts in UniGUI components in Dephi?

When I try to create JS-code for any event in UNIEvents property editor directly, it allows me to write code in multiple lines.

But when a form is creating at runtime - exception raises.

The same code placed in single line successfully works.

Is it normal for JS in UniGUI or I could do something to fix it? Thank's in advance for you patience

(I'm absotutely zero in JS, sorry one more time :-( )

Sherzod Advanced Member

Sherzod

Posted
Posted
52 minutes ago, Nadya said:

But when a form is creating at runtime - exception raises.

The same code placed in single line successfully works.

For example? 

Nadya Member

Nadya

Posted
Posted
10 hours ago, Sherzod said:

For example?

I wrote "beforeInit" JS code directly in the property editor of my grid.  I've made some screenshots:

JS beforeInit code with wrap

When form with my grid is loading - this error happens:

Error message

Then I removed all returns and placed my code in a single line:

Same beforeInit code without wrap

In this case form loaded correctly and "expandSelectedNode" method works properly

Nadya Member

Nadya

Posted
Posted
4 hours ago, Sherzod said:

Hello,

Can you make a simple testcase to check and attach it to googledrive?

Прошу прощения, можно, я на русский перейду? С моим дубовым английским  объясняться - только Ваше время тратить :-(

Я сделала небольшой проект, чтобы проверить проблему с переводом строк в скрипте. Но ошибка, возникающая в основном проекте, не воспроизводится.

Тестовый проект

Правда, в отличие от основного, в данном проекте в качестве источника вместо TADOQuery данных используется TClientDataSet, поэтому метод поиска посредством AsoluteIndex изменен на обычный Locate, грид же со всеми свойствами скопирован с основного проекта. При этом в отличие от основного, в данном примере при поиске перестал разворачиваться нод, в ветке которого находится искомый. То есть искомый нод становится Selected, но каскадное развертывание до него не отрабатывает. Повторюсь, в основном проекте тот же JS-код работает нормально.

Что касается ошибки при многострочном JS-коде в основном проекте - я попробую получить весь снегерированный код страницы с ошибкой и без нее, чтобы сравнить. Возможно, там какое-то сочетание элементов некорректное в коде получилось, либо с юникодными строками или текстами, содержащими кавычки.

Nadya Member

Nadya

Posted
Posted
9 minutes ago, Sherzod said:

Пожалуйста, создайте новую ветку

Хорошо, извините за причиненное неудобство

Nadya Member

Nadya

Posted
Posted

Excuse me for disturbance. Problem with multiline JS-code was solved. Troubles were not in UniGUI components. Thank you for your attention!

  • Like 1
Sherzod Advanced Member

Sherzod

Posted
Posted
3 minutes ago, Nadya said:

Excuse me for disturbance. Problem with multiline JS-code was solved. Troubles were not in UniGUI components. Thank you for your attention!

Thank you for the update.

  • Like 1
Nadya Member

Nadya

Posted
Posted
On 6/18/2020 at 6:04 PM, Nadya said:
On 6/18/2020 at 5:58 PM, Sherzod said:

Can you try this approach? 



  ...
  FindInQuery(tmpCriteria, qrData);
  StructureGrid.JSInterface.JSCall('expandSelectedNode', []);
  StructureGrid.JSInterface.JSCode('Ext.defer(function(){'#1'.ensureVisible('#1'.getSelection()[0])}, 200);'); //<-----
  ...

It works!!! Thank you very very much!

Hi!

I heed help again :unsure: Problem is in displaying the selected dbtreegrid node which was found in underlying dataset by Locate(...) method.

I have two TUniDBTreeGrid components on form. GridStructure shows structure of nodes with two levels, GridData should display info for selected node in GridStructure.

So when I use Locate to find node in manually or programmatically collapsed GridStructure, dataset position is correct and info in GridData is OK, but the selection in GridStructure displays incorrectly. I wrote "expandSelectedNode" method (as you advised me):

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

And after locating record I use this code:

grdStructure.JSInterface.JSCall('expandSelectedNode', []);
grdStructure.JSInterface.JSCode('Ext.defer(function(){'#1'.ensureVisible('#1'.getSelection()[0])}, 200);');

But is doesn't helph in some cases. I've made a testcase to demonstrate my problem.

TreeGridLocationTestCase

 

Please, do following:

1) Select node "Node1" in GridStructure, press button "Refresh info" below - Node1 is selected in GridStructure, GridData shows info for Node1 = CORRECT

2) Expand Node1, select child node "Node1_13" in GridStructure, press button "Refresh info" - Node1_13 is selected in GridStructure, GridData shows info for Node1_13 = CORRECT

3) Select Node1_13, press button "RefreshStructure" higher, press button "RefreshData" below - tree is collapsed, selection is not visible in GridStructure, GridData shows info for Node1_13 = INCORRECT

4) Expand Node1 in GridStructure, type text "Node1_14" in the edit box on the top of form,  press button "Search structure node" - node "Node1_14" is found and selected, GridData shows info for Node1_14 = CORRECT

5) Collapse tree in GridStructure, type text "Node1_15" in the edit box on the top of form,  press button "Search structure node" - tree is collapsed, selection is not visible in GridStructure, GridData shows info for Node1_15 = INCORRECT

Please, "kick me out" of this swamp, somebody!:sad:

Thank you!

 

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...