What's New?

[CLOSED] Expanded West Region Panel with Accordion Layout issue

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1
    Jan 08, 2015, 10:53 PM

    [CLOSED] Expanded West Region Panel with Accordion Layout issue

    Hi,

    This is how it was in Ext 2.5.3:



    When west panel was collapsed and expanded by clicking the vertical panel title, the accordion layout was working fine.

    This is what is happening in Ext 3.0.0 (Ext JS 5.0.1.1255)



    The whole panel is collapsing when switching panels in accordion layout. (The grid is fine... I had to remove some information there)

    Thank you,
    Attached Thumbnails Click image for larger version.  Name: accordion-expanded-extjs4.png  Views: 20  Size: 8.1 KB  ID: 18571   Click image for larger version.  Name: accordion-expanded-extjs5.png  Views: 20  Size: 10.1 KB  ID: 18581  
    Last edited by Daniil; Jan 14, 2015 at 11:45 AM. Reason: [CLOSED] [#617]
  2. #2
    Jan 09, 2015, 1:36 PM
    Please post a complete (but simplified) code sample demonstrating how to reproduce the issue.
  3. #3
    Jan 09, 2015, 8:43 PM
    Hi Raphael,

    That's the markup (no explicit code involved): 

    <%@ Page Language="C#" %>

<!DOCTYPE html>

<html>
<head runat="server">
	<title>Ext.NET v3 Example</title>
</head>
<body>
	<form runat="server">
		<ext:ResourceManager
			runat="server"
			Theme="Gray"
			ScriptMode="Release" />

		<ext:Viewport runat="server" Layout="FitLayout">

			<Items>

				<ext:Container
					runat="server"
					Layout="BorderLayout">
					<Items>
						<ext:Panel
							runat="server"
							Region="West"
							Layout="AccordionLayout"
							Title="Now click this header..."
							Width="300"
							Border="false"
							Split="true"
							Collapsible="true"
							Header="false">
							<Items>
								<ext:TreePanel
									runat="server"
									Border="false"
									Title="Collapse West Panel (double click on splitter)"
									OverflowY="Auto"
									RootVisible="true"
									Frame="false"
									Lines="false"
									UseArrows="true"
									Animate="false"
									Cls="documents-tree">
									<Store>
										<ext:TreeStore
											runat="server"
											ShowWarningOnFailure="false">
											<Proxy>
												<ext:AjaxProxy
													Url="GetFolders.ashx"
													Timeout="99999">
												</ext:AjaxProxy>
											</Proxy>
										</ext:TreeStore>
									</Store>
									<Root>
										<ext:Node
											NodeID="0"
											Text="Data Sources"
											IconCls=""
											Expanded="false" />
									</Root>
								</ext:TreePanel>

								<ext:TreePanel
									runat="server"
									Border="false"
									Region="West"
									Title="Click me when west panel header is colapsed"
									OverflowY="Auto"
									RootVisible="true"
									Frame="false"
									Lines="false"
									UseArrows="true"
									Animate="false">

								</ext:TreePanel>
							</Items>
						</ext:Panel>

						<ext:Panel
							runat="server"
							Frame="false"
							Region="Center"
							Header="false"
							Layout="FitLayout"
							Border="true">
							<BottomBar>
								<ext:Toolbar runat="server">
									<Items>
										<ext:Button runat="server" Text="Placeholder" />
									</Items>
								</ext:Toolbar>
							</BottomBar>
						</ext:Panel>
					</Items>
				</ext:Container>
			</Items>
		</ext:Viewport>
	</form>
</body>
</html>
  4. #4
    Jan 10, 2015, 4:31 AM
    Hi Matt, i am gonna investigate it right away.
  5. #5
    Jan 10, 2015, 5:14 AM
    Hi Matt, i got the sample down to bare minimum

    Test case:

    • Double click on splitter (West region is collapsed)
    • Expand West region by clicking its header
    • Expand Panel 2 (Layout Error)
    • Expand Panel 1 (Layout Error)


    <!DOCTYPE html>
<html>
<head runat="server">
</head>
<body>
    <form runat="server">
        <ext:ResourceManager Theme="Gray" ScriptMode="Debug" runat="server" />
        <ext:Viewport runat="server" Layout="FitLayout">
            <Items>
                <ext:Container Layout="BorderLayout" runat="server">
                    <Items>
                        <ext:Panel Region="West" Layout="AccordionLayout" Title="West" Width="300" Border="false" Split="true" Collapsible="true" Header="false" runat="server">
                            <Items>
                                <ext:Panel Border="false" Title="Panel 1" Html="Ext.Net 1" runat="server" />
                                <ext:Panel Border="false" Title="Panel 2" Html="Ext.Net 2" runat="server" />
                            </Items>
                        </ext:Panel>
                        <ext:Panel Region="Center" Header="false" Layout="FitLayout" Border="true" Html="Content" runat="server" />
                    </Items>
                </ext:Container>
            </Items>
        </ext:Viewport>
    </form>
</body>
</html>

    As far i can see it has been fixed on Ext.Js 5.1. I proceeded through the steps presented above on http://dev.sencha.com/ext/5.1.0/exam...tal/index.html, and everything worked as expected. It's possible to reproduce the issue on the Ext.Net equivalent example: https://examples3.ext.net/#/Portal/Basic/Simple/.

    Matt, Ext.Net team is currently incorporating Ext.Js 5.1 and it may be available next week.

    Daniil, can you try to reproduce the issue presented above on the newest version?
    Last edited by RaphaelSaldanha; Jan 10, 2015 at 5:25 AM.
  6. #6
    Jan 10, 2015, 7:34 AM
    Thank you Raphael for reproducing the problem in a simply way.

    At the moment I am on very tight deadline... I bet it is going to difficult to explain my supervisors why I have decided to move to Ext.3.0 and not made a big progress last week.
    I am sure it will payoff soon as it is clear that ExtJS5 despite some issues is much faster and looks better (noticed that in IE).

    Any ETA on release ExtJS 5.1.0 in Ext.Net ?

    Best Regards,

Similar Threads

  1. [CLOSED] Border-layout-east-and-west-region-clip-header-text-on-collapse-in-firefox
    By RCM in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 24, 2013, 5:22 AM
  2. [CLOSED] Border layout east and west region clip header text on collapse in firefox
    By RCM in forum 2.x Legacy Premium Help
    Replies: 8
    Last Post: Jan 24, 2013, 5:21 AM
  3. [CLOSED] Ext:panel of region west and collapsible="true" reloading the its inheritance
    By Aparna_B in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jun 14, 2012, 11:30 AM
  4. [CLOSED] A minor flaw on panel putting on region "West"
    By cleve in forum 2.x Legacy Premium Help
    Replies: 1
    Last Post: Jun 08, 2012, 8:34 AM
  5. ExtJs Extender in west region
    By maxdiable in forum 1.x Help
    Replies: 4
    Last Post: Jun 10, 2009, 4:00 AM

Tags for this Thread

Posting Permissions