PDA

View Full Version : [CLOSED] Accordion is not stretched to browser



speedstepmem4
Nov 21, 2013, 12:53 PM
In our portal page Region="west" accordion is not stretched to browser.

Please check the code and let us know where we made mistake?




<ext:Viewport ID="ViewPort1" runat="server" StyleSpec="background-color: transparent;"
Layout="BorderLayout">
<Items>
<ext:Panel ID="pnlNorth" runat="server" Height="75" Border="false" Header="false"
BodyStyle="background-color: transparent;" Region="North">
<Content>
<div id="settingsWrapper">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td>
<div id="settings">
<div id="item1" runat="server">
</div>
<div id="item2" runat="server">
</div>
<div id="item3" runat="server">
</div>
</div>
</td>
<td align="right">
<div>
<div id="help" runat="server" style="display: none">
</div>
<div id="information" runat="server" style="display: none">
</div>
<ext:Button ID="btnMySetting" runat="server" Hidden="false" MenuArrow="false" Cls="x-menu-horizontal"
MenuAlign="tr-br">
<Menu>
<ext:Menu ID="mnuMySetting" runat="server" Width="200">
<Items>
<ext:MenuItem ID="itemSetting" runat="server" ActiveCls="active-menu" />
<ext:MenuSeparator StyleSpec="height: 2px;background-color: #C6C6C6;" />
<ext:MenuItem ID="logout" runat="server" ActiveCls="active-menu" />
</Items>
<Listeners>
<AfterRender Handler="onAfterRender(this, btnMySetting);" />
</Listeners>
</ext:Menu>
</Menu>
<Listeners>
<AfterRender Handler="onAfterButtonRender(this);" />
</Listeners>
</ext:Button>
</div>
</td>
</tr>
</table>
</div>
<div style="vertical-align: top">
<table cellpadding="0" cellspacing="0" width="100%" border="0">
<tr>
<td width="20%" align="left" style="padding-left: 15px;">
<img src="images/dimension.png" runat="server" id="imgSpeedStepDimLogo" />
</td>
<td width="60%" align="center" style="color: #c0c0c0;">
<ext:Label ID="lbl_head" StyleSpec="font-weight:bold;" runat="server">
</ext:Label>
</td>
</tr>
</table>
</div>
</Content>
</ext:Panel>
<ext:Panel runat="server" Width="165" ID="pnlSettings" BodyStyle="background-color: #bacfee;"
Region="West" Collapsible="true"
Split="true"
Layout="AccordionLayout">
<Items>
<ext:Panel ID="Panel1" runat="server" Border="false"
BodyStyle="padding:6px;">
<Content>
<div class="link_west">
<ul>
<li id="menu_dash" runat="server"><a href="#" id="href_one" runat="server" onclick="check('1');">
<asp:Literal ID="lbl_dash" runat="server"></asp:Literal></a></li>
</ul>
</div>
</Content>
</ext:Panel>
<ext:Panel ID="Panel4" runat="server" Border="false"
BodyStyle="padding:6px;">
<Content>
<div class="link_west">
<ul>
<li id="menu_business_terms" runat="server"><a href="#" id="href_lbl_business_terms"
onclick="check('6');">
<asp:Literal ID="lbl_business_terms" runat="server"></asp:Literal></a></li>
</ul>
</div>
</Content>
</ext:Panel>
<ext:Panel ID="Panel8" runat="server" Border="false"
BodyStyle="padding:6px;">
<Content>
<div class="link_west">
<ul>
<li id="Li1" runat="server"><a href="#" id="href_lbl_user_settings" onclick="check('7');">
<asp:Literal ID="lbl_user_settings" runat="server"></asp:Literal></a></li>
<li id="Li2" runat="server"><a href="#" id="href_lbl_user_group" onclick="check('7.1');">
<asp:Literal ID="lbl_user_group" runat="server"></asp:Literal></a></li>
<li id="Li3" runat="server"><a href="#" id="href_lbl_absence" onclick="OpenAbsence();">
<asp:Literal ID="lbl_absence" runat="server"></asp:Literal></a></li>
</ul>
</div>
</Content>
</ext:Panel>
<ext:Panel ID="Panel2" runat="server" Border="false"
BodyStyle="padding:6px;">
<Content>
<div class="link_west">
<ul>
<li id="menu_article" runat="server"><a href="#" id="href_lbl_article" onclick="check('2');">
<asp:Literal ID="lbl_article" runat="server"></asp:Literal></a></li>
</ul>
</div>
</Content>
</ext:Panel>
<ext:Panel ID="Panel3" runat="server" Border="false"
BodyStyle="padding:6px;">
<Content>
<div class="link_west">
<ul>
<li id="menu_workcenterorder" runat="server"><a href="#" id="href_lbl_workcenterorder"
onclick="check('3');">
<asp:Literal ID="lbl_workcenterorder" runat="server"></asp:Literal></a></li>
</a></li>
<li id="menu_multi_order" runat="server"><a href="#" id="href_lbl_multi_order" onclick="check('28');">
<asp:Literal ID="lbl_multi_order" runat="server"></asp:Literal></a></li>
<li id="menu_delivery_date" runat="server"><a href="#" id="href_lbl_delivery_date_confirm"
onclick="check('29');">
<asp:Literal ID="lbl_delivery_date_confirm" runat="server"></asp:Literal></a></li>

</ul>
</div>
</Content>
</ext:Panel>
<ext:Panel ID="Panel5" runat="server" Border="false"
BodyStyle="padding:6px;">
<Content>
<div class="link_west">
<ul>
<li id="menu_quality_terms" runat="server"><a href="#" id="href_lbl_quality_terms"
onclick="check('15');">
<asp:Literal ID="lbl_quality_terms" runat="server"></asp:Literal></a></li>
<li id="menu_quality_control" runat="server"><a href="#" id="href_lbl_quality_control"
onclick="check('10');">
<asp:Literal ID="lbl_quality_control" runat="server"></asp:Literal></a></li>
</ul>
</div>
</Content>
</ext:Panel>
<ext:Panel ID="Panel6" runat="server" Border="false"
BodyStyle="padding:6px;">
<Content>
<div class="link_west">
<ul>
<li id="menu_workfolow_status" runat="server"><a href="#" id="href_lbl_wrk_status"
onclick="check('12');">
<asp:Literal ID="lbl_wrk_status" runat="server"></asp:Literal></a></li>
<li id="menu_workflow_comm" runat="server"><a href="#" id="href_lbl_wrk_comm" onclick="check('24');">
<asp:Literal ID="lbl_wrk_comm" runat="server"></asp:Literal></a></li>
<li id="menu_sample_delivery" runat="server"><a href="#" id="href_lbl_sample_delivery"
onclick="check('32');">
<asp:Literal ID="lbl_sample_delivery" runat="server"></asp:Literal></a></li>
</ul>
</div>
</Content>
</ext:Panel>
<ext:Panel ID="Panel7" runat="server" Border="false"
BodyStyle="padding:6px;">
<Content>
<div class="link_west">
<ul>
<li id="menu_shipment_status" runat="server"><a href="#" id="href_lbl_shipment_status"
onclick="check('25');">
<asp:Literal ID="lbl_shipment_status" runat="server"></asp:Literal></a></li>
<li id="menu_packing_list" runat="server"><a href="#" id="href_lbl_Packing_list"
onclick="check('26');">
<asp:Literal ID="lbl_Packing_list" runat="server"></asp:Literal></a></li>
<li id="menu_container_list" runat="server"><a href="#" id="href_lbl_container_loading"
onclick="check('31');">
<asp:Literal ID="lbl_container_loading" runat="server"></asp:Literal></a></li>
<li id="menu_shipment_list" runat="server"><a href="#" id="href_lbl_shipment_list"
onclick="check('23');">
<asp:Literal ID="lbl_shipment_list" runat="server"></asp:Literal></a></li>
<li id="menu_vessel_book" runat="server"><a href="#" id="href_lbl_vessel_book" onclick="CallPage('36',this);">
<asp:Literal ID="lbl_vessel_book" runat="server"></asp:Literal></a></li>
</ul>
</div>
</Content>
</ext:Panel>
<ext:Panel ID="pnl_business_partner" runat="server" Border="false" BodyStyle="padding:6px;">
<Content>
<div class="link_west">
<ul>
<li id="menu_business_partner" runat="server"><a href="#" id="href_lbl_business_partner"
onclick="check('33');">
<asp:Literal ID="lbl_partner" runat="server"></asp:Literal></a></li>
<li id="menu_contacts" runat="server"><a href="#" id="href_lbl_partner_contacts"
onclick="check('35');">
<asp:Literal ID="lbl_contacts1" runat="server"></asp:Literal></a></li>
</ul>
</div>
</Content>
</ext:Panel>
<ext:Panel ID="pnl_live_users" runat="server" Border="false"
BodyStyle="padding:6px;" ContextMenuID="chatContext">
<Content>
<div class="user-list" id="divChatUsers" runat="server">
</div>
</Content>
</ext:Panel>
</Items>
</ext:Panel>
<ext:TabPanel ID="TabPanel1" runat="server" AutoScroll="false" BodyStyle="background-color: transparent; border: 1px solid #AABBCC; border-top: none; "
TabPosition="top" Region="Center">
<Items>
<ext:Panel ID="Tab1" runat="server" BodyStyle="background:white">
<Loader runat="server" ID="loader1" Mode="Frame">
</Loader>
<DirectEvents>
<Show OnEvent="GridNavigateProcess" ShowWarningOnFailure="false" Timeout="120000"
Success="CEvent();">
</Show>
</DirectEvents>
<Listeners>
<BeforeShow Handler="ClearNormalView();" />
<Show Handler="DisableTabs(0);" />
</Listeners>
</ext:Panel>

</Items>
</ext:TabPanel>
</Items>
</ext:Viewport>

geoffrey.mcgill
Nov 21, 2013, 2:05 PM
In our portal page Region="west" accordion is not stretched to browser.

I'm not sure what this means.

Your sample throws an Exception.

Please simplify your code sample. You shouldn't require more than 100 lines of code to demonstrate the problem.

Daniil
Nov 21, 2013, 2:06 PM
Hi @speedstepmem4,

I think the Panel1, Panel4, Panel8, etc. are stretched. But their Content are not.

Ext.NET and ExtJS don't size container's HTML Content. Layouts deal with the Ext.NET/ExtJS components only.