Apr 29, 2013, 10:19 AM
[CLOSED] Accordion Control with TreePanel Not Expanding
Hi,
i m using ext.net v2.0. i m planning to upgrade Menu control of my old site (asp.net) with Ext.net accordion control. i've added the accordion control from markup.
In my application i want each panel should represent a Module of the application and it'll contain tree panel for the Menu links (screenshot attached for your reference). now the problem i m facing is, if i add 3-4 panel to accordion the it works ok, but if i add around 10 to 12 panel's (that is module count of my application) the i can see all the panel in accordion control but if i try to expand it, it expands backside of next panel and i can't access the tree panel inside it.
i want the selected panel should be expanded (not at it's full but at least few menus visible and a scroll bar should appear to scroll between menus) and a scroll bar should appear at the accordion control to scroll between panels/modules.
can anybody help me in this regards..?
source code attached herewith.
i m using ext.net v2.0. i m planning to upgrade Menu control of my old site (asp.net) with Ext.net accordion control. i've added the accordion control from markup.
In my application i want each panel should represent a Module of the application and it'll contain tree panel for the Menu links (screenshot attached for your reference). now the problem i m facing is, if i add 3-4 panel to accordion the it works ok, but if i add around 10 to 12 panel's (that is module count of my application) the i can see all the panel in accordion control but if i try to expand it, it expands backside of next panel and i can't access the tree panel inside it.
i want the selected panel should be expanded (not at it's full but at least few menus visible and a scroll bar should appear to scroll between menus) and a scroll bar should appear at the accordion control to scroll between panels/modules.
can anybody help me in this regards..?
source code attached herewith.
<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="newsitemap._Default" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head id="Head1" runat="server">
<title>Load SiteMap into TreePanel - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
<script>
var loadPage = function (record) {
var pnl = Ext.getCmp("Panel2");
pnl.load(record.data.id);
};
</script>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager runat="server"/>
<ext:Viewport runat="server" Layout="BorderLayout">
<Items>
<ext:Panel
ID="WestPanel"
runat="server"
Region="West"
Title="Bways Menu Explorer"
Width="175"
Layout="Accordion"
MinWidth="175"
MaxWidth="400"
Split="true"
Collapsible="true">
<Items>
<ext:TreePanel runat="server" Title="Online Users" RootVisible="false">
<Tools>
<ext:Tool Type="Refresh" Handler="Ext.Msg.alert('Message','Refresh Tool Clicked!');" />
</Tools>
<Root>
<ext:Node Text="Root">
<Children>
<ext:Node Text="Friends" Expanded="true">
<Children>
<ext:Node Text="Jack" Icon="User">
<Children>
<ext:Node Text="Jack" Icon="User" Leaf="True" NodeID="Bodypage_1.aspx" />
<ext:Node Text="Brian" Icon="User" Leaf="True" NodeID="Bodypage_2.aspx" />
<ext:Node Text="Jon" Icon="User" Leaf="True" NodeID="Bodypage_3.aspx"/>
<ext:Node Text="Tim" Icon="User" Leaf="True" />
<ext:Node Text="Nige" Icon="User" Leaf="True" />
<ext:Node Text="Fred" Icon="User" Leaf="True" />
<ext:Node Text="Bob" Icon="User" Leaf="True" />
</Children>
</ext:Node>
<ext:Node Text="Brian" Icon="User" Leaf="True" />
<ext:Node Text="Jon" Icon="User" Leaf="True" />
<ext:Node Text="Tim" Icon="User" Leaf="True" />
<ext:Node Text="Nige" Icon="User" Leaf="True" />
<ext:Node Text="Fred" Icon="User" Leaf="True" />
<ext:Node Text="Bob" Icon="User" Leaf="True" />
</Children>
</ext:Node>
<ext:Node Text="Family" Expanded="true">
<Children>
<ext:Node Text="Kelly" Icon="UserFemale" Leaf="True" />
<ext:Node Text="Sara" Icon="UserFemale" Leaf="True" />
<ext:Node Text="Zack" Icon="UserGreen" Leaf="True" />
<ext:Node Text="John" Icon="UserGreen" Leaf="True" />
</Children>
</ext:Node>
</Children>
</ext:Node>
</Root>
<Listeners>
<%--<ItemClick Fn="onItemClick"/>--%>
<ItemClick Handler="loadPage(record)" />
</Listeners>
</ext:TreePanel>
<ext:Panel runat="server" Title="Settings" />
<ext:Panel runat="server" Title="Even More Stuff" />
<ext:Panel runat="server" Title="My Stuff" />
<ext:Panel ID="Panel1" runat="server" Title="My Stuff-1" />
<ext:Panel ID="Panel3" runat="server" Title="My Stuff-2" />
<ext:Panel ID="Panel4" runat="server" Title="My Stuff-3" />
<ext:Panel ID="Panel5" runat="server" Title="My Stuff-4" />
<ext:Panel ID="Panel6" runat="server" Title="My Stuff-5" />
<ext:Panel ID="Panel7" runat="server" Title="My Stuff-6" />
<ext:Panel ID="Panel8" runat="server" Title="My Stuff-7" />
<ext:Panel ID="Panel9" runat="server" Title="My Stuff-8" />
<ext:Panel ID="Panel10" runat="server" Title="My Stuff-9" />
<ext:Panel ID="Panel11" runat="server" Title="My Stuff-10" />
<ext:Panel ID="Panel12" runat="server" Title="My Stuff-11" />
</Items>
</ext:Panel>
<ext:Panel ID="Panel2" runat="server" Margins="5" Region="Center" BodyPadding="10" >
<Loader ID="Loader1" runat="server" Url="http://google.com" Mode="Html">
<LoadMask ShowMask="true" />
</Loader>
</ext:Panel>
</Items>
</ext:Viewport>
</form>
</body>
</html>
Last edited by Daniil; May 07, 2013 at 3:44 AM.
Reason: [CLOSED]
