I am attempting to make a tree shift-down when a dropdown is showing by changing the pixels of a container. I am struggling with using events to perform this without error. Is there an event, or methof, to tell when the dropdown is showing? Using onFocus and onBlur is giving me some issues; sometimes the container stays expanded when not in focus.
You could probably achieve this with CSS using the custom stylesheet. When the dropdown is open it get a class of .iaDropdownCommon_active. Utilizing a adjacent sibling combinator you could apply a transformation to the tree.
I added this to my stylesheet and applied the class of testing/tree to my tree, so anytime the dropdown above the tree is opened the tree will be moved down 100px. I only tested this in an up to date chrome, it may or may not work in workstation.
Why are you doing this?
It's a common UI pattern to have a dropdown appear 'over top' of other content, temporarily obscuring it. There's a reason it's not easy to do this - you're swimming against a well established UI pattern. What's the reasoning?
Rather than filtering the tree components' actual contents, I wanted to create a search option that did not cover it, as covering the tree feels counterintuitive. But if accomplishing this counters UI standards then maybe I should take a different approach to the problem. Any further guidance is greatly appreciated.
The dropdown contains all of the reports that are listed in the tree. If a report is selected in the dropdown, it then expands the folders and selects the report in the tree, as well as opens the report in a report viewer component.