[OPEN] [#1560] [4.4.1] Bug in Treepanel inside a dropdown

Hello
We recently upgraded a project from Ext.Net 2.3 to 4.4. We have a lot of dropdown with a treepanel as their components. These are not working correctly now, when expanding nodes the drop-down collapses and user needs to expand the dropdown again to navigate the tree.
I could reproduce this in examples project, based on treepanel with loader (.ashx).

Code:

<%@ Page Language="C#" %> <!DOCTYPE html> <html> <head runat="server"> <title>TreePanel with ajax proxy using HttpHandler - Ext.NET Examples</title> <link href="/resources/css/examples.css" rel="stylesheet" /> </head> <body> <form runat="server"> <ext:ResourceManager runat="server" /> <h1>TreePanel with ajax proxy using HttpHandler</h1> <ext:DropDownField runat="server" Width="500"> <Component> <ext:TreePanel ID="TreePanel1" RootVisible="False" runat="server" Title="Tree" Height="300" Width="200" Shadow="false" UseArrows="true" AutoScroll="true" ContainerScroll="true" > <Store> <ext:TreeStore runat="server"> <Proxy> <ext:AjaxProxy Url="TreeLoader.ashx" /> </Proxy> </ext:TreeStore> </Store> <Root> <ext:Node NodeID="0" Text="Root" /> </Root> </ext:TreePanel> </Component> </ext:DropDownField> </form> </body> </html>

To Reproduce
Click Dropdown to expand, now expand some nodes and then their children, you will see the 'picker' element gets closed. This is annoying for the user.

Hi @Fabricio
Any update on this bug?thanks,

Hello @mirwais!

This really look like a bug due to the loader mask that is shown during load. At some point the load mask focuses to an non-existing component and this acts as a focus outside.

On a pragmatic approach, seems like ignoring focus changes "to nothing" fixes the issue. Can you test this throughout your application to see if you get any undesired side effects?

Code:

Ext.define("thread62129", { override: "Ext.ComponentManager", onGlobalFocus: function (e) { var me = this; if (Ext.Component.from(e.toElement) == null) return; return me.callParent(arguments); } });

Looking forward to your feedback!

This bug looks very similar to #901 but the alternatives given there does not apply here, so assuming it a new issue. We've logged this issue as #1560 in our issues tracking platform.

Hi @Fabricio
Thank you very much, this fix for now works and I don't see any side effects for the moment.
However I see that there is a problem when it's inside a window container, as I said in previous versions (2.3) we did not have these issues. Probably these bugs are related, so to take my previous example inside a window, with your patch:

Code:

<ext:Window runat="server" Width="600" Height="300" Layout="FormLayout" > <Items> <ext:DropDownField runat="server" Width="500"> <Component> <ext:TreePanel ID="TreePanel1" RootVisible="False" runat="server" Title="Tree" Shadow="false" UseArrows="true" AutoScroll="true" ContainerScroll="true" > <Store> <ext:TreeStore runat="server"> <Proxy> <ext:AjaxProxy Url="TreeLoader.ashx" /> </Proxy> </ext:TreeStore> </Store> <Root> <ext:Node NodeID="0" Text="Root" /> </Root> <%--<ViewConfig LoadMask="false" />--%> </ext:TreePanel> </Component> </ext:DropDownField> </Items> </ext:Window>

Bug: expand the drop down and move the window, dropdown's picker is somehow detached and this creates some other issues in the UI. This problem is not there when my drop down has a list instead of a tree, like a simple grid, or a combobox instead of a dropdown.

Hello, @mirwais!

If the workaround here does not represent a fix for this issue you last posted, maybe we'd better handle that in another forum thread or it will become confuse to track the different issues with the component.