This is a migrated thread and some comments may be shown as answers.

TreeView with DropDownButton

3 Answers 82 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Matej
Top achievements
Rank 1
Veteran
Matej asked on 14 May 2020, 04:09 PM
Hi, I have a TreeView with DropDownButton in custom rows and popups opening will break if I click through different DropDownButtons . I click on a button and no popup is displayed. Any suggestion what I did wrong? https://stackblitz.com/edit/react-s6l3qq

3 Answers, 1 is accepted

Sort by
0
Matej
Top achievements
Rank 1
Veteran
answered on 15 May 2020, 08:23 AM
here is a gif of the problem
0
Accepted
Stefan
Telerik team
answered on 15 May 2020, 02:03 PM

Hello, Matej,

Thank you for your example.

After in-depth research, I found the reason for this behavior.

The DropDownButton is programmed to close on blur and the TreeView has an internal logic to focus the clicked item. What is happening is that as these events fired almost instantly, sometimes the popup list is opened before the TreeView item is focused and milliseconds after that when the TreeView item is focused, causes blur on the popup and closes it. As this happens almost at the same frame, it seems that the list is never opened, but if you observe the DOM, you can see the list being rendered for a fraction of a second and then removed.

Currently, it can be resolved by stopping the event propagation on the TreeView item, this will require small modification on the styling as the div or span has different styles then <>

This is the updated example:

https://stackblitz.com/edit/react-s6l3qq-uubrlc?file=app/main.jsx

Regards,
Stefan
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.
0
Matej
Top achievements
Rank 1
Veteran
answered on 15 May 2020, 02:58 PM
Thank you!
Tags
General Discussions
Asked by
Matej
Top achievements
Rank 1
Veteran
Answers by
Matej
Top achievements
Rank 1
Veteran
Stefan
Telerik team
Share this question
or