Jan 14, 2015, 7:54 AM
[CLOSED] [#548] [4.3.0] GroupTabPanel Example
Dear ext.net developers,
Example with GroupTabPanel is not working on your site. I tried to recreate this example locally and got strange error: the tabs are not visible.
Example with GroupTabPanel is not working on your site. I tried to recreate this example locally and got strange error: the tabs are not visible.
<ext:Viewport runat="server" Layout="FitLayout">
<Items>
<ext:Panel runat="server" Layout="FitLayout" Border="false">
<Items>
<ext:GroupTabPanel ID="GroupTabPanel1" runat="server">
<Items>
<ext:Panel runat="server">
<Items>
<ext:Portal
runat="server"
Title="Dashboard"
Border="false">
<Items>
<ext:PortalColumn
runat="server"
ColumnWidth="1">
<Items>
<ext:Portlet
runat="server"
Title="Portlet 1"
Padding="6"
Html="1"
/>
<ext:Portlet
runat="server"
Title="Portlet 2"
Padding="6"
Html="2"
/>
</Items>
</ext:PortalColumn>
</Items>
</ext:Portal>
<ext:Panel
runat="server"
Title="Subscriptions"
Icon="Newspaper"
StyleSpec="padding: 10px;"
Border="false"
Layout="Fit">
<Items>
<ext:TabPanel runat="server" ActiveTabIndex="0">
<Items>
<ext:Panel
runat="server"
Title="Subscriptions"
BodyPadding="5"
Html="3"
/>
</Items>
</ext:TabPanel>
</Items>
</ext:Panel>
<ext:Panel
runat="server"
Title="Users"
Icon="Group"
StyleSpec="padding: 10px;"
Html="4"
/>
</Items>
</ext:Panel>
<ext:Panel runat="server">
<Items>
<ext:Panel
runat="server"
Title="Configuration"
StyleSpec="padding: 10px;"
Html="5"
/>
<ext:Panel
runat="server"
Title="Email Templates"
Icon="Email"
StyleSpec="padding: 10px;"
Border="false">
<Items>
<ext:FormPanel runat="server" Title="Form Layout" BodyStyle="padding:15px">
<FieldDefaults LabelWidth="75" LabelPad="20" LabelSeparator="" />
<Defaults>
<ext:Parameter Name="width" Value="230" />
<ext:Parameter Name="msgTarget" Value="side" />
</Defaults>
<Items>
<ext:TextField runat="server" FieldLabel="First Name" AllowBlank="false" />
<ext:TextField runat="server" FieldLabel="Last Name" />
<ext:TextField runat="server" FieldLabel="Company" />
<ext:TextField runat="server" FieldLabel="Email" Vtype="email" />
</Items>
<Buttons>
<ext:Button runat="server" Text="Save" />
<ext:Button runat="server" Text="Cancel" />
</Buttons>
</ext:FormPanel>
</Items>
</ext:Panel>
</Items>
</ext:Panel>
</Items>
</ext:GroupTabPanel>
</Items>
<BottomBar>
<ext:Toolbar runat="server">
<Items>
<ext:SplitButton
runat="server"
AllowDepress="false"
Icon="Tab"
ToggleGroup="group"
Pressed="true"
Text="Dashboard">
<Menu>
<ext:Menu runat="server">
<Items>
<ext:MenuItem runat="server" Text="Tickets" Icon="TagBlue">
<Listeners>
<Click Handler="#{GroupTabPanel1}.setActiveGroup(0) && #{GroupTabPanel1}.setActiveTab(1);" />
</Listeners>
</ext:MenuItem>
<ext:MenuItem runat="server" Text="Subscriptions" Icon="Newspaper">
<Listeners>
<Click Handler="#{GroupTabPanel1}.setActiveGroup(0) && #{GroupTabPanel1}.setActiveTab(2);" />
</Listeners>
</ext:MenuItem>
<ext:MenuItem runat="server" Text="Users" Icon="Group">
<Listeners>
<Click Handler="#{GroupTabPanel1}.setActiveGroup(0) && #{GroupTabPanel1}.setActiveTab(3);" />
</Listeners>
</ext:MenuItem>
</Items>
</ext:Menu>
</Menu>
<Listeners>
<Click Handler="#{GroupTabPanel1}.setActiveGroup(0) && #{GroupTabPanel1}.setActiveTab(0);" />
</Listeners>
</ext:SplitButton>
<ext:ToolbarSpacer runat="server" />
<ext:SplitButton
ID="Group2Btn"
AllowDepress="false"
runat="server"
Icon="Tab"
ToggleGroup="group"
Text="Configuration">
<Menu>
<ext:Menu runat="server">
<Items>
<ext:MenuItem runat="server" Text="Email Templates" Icon="Email">
<Listeners>
<Click Handler="#{GroupTabPanel1}.setActiveGroup(1) && #{GroupTabPanel1}.setActiveTab(1);" />
</Listeners>
</ext:MenuItem>
</Items>
</ext:Menu>
</Menu>
<Listeners>
<Click Handler="#{GroupTabPanel1}.setActiveGroup(1) && #{GroupTabPanel1}.setActiveTab(0);" />
</Listeners>
</ext:SplitButton>
<ext:ToolbarFill runat="server" />
<ext:Button ID="Button1" runat="server" Text="Set Custom Css Class" Icon="BulletBlue">
<Listeners>
<Click Handler="#{GroupTabPanel1}.addCls('custom'); this.disable(); #{Button2}.enable();" />
</Listeners>
</ext:Button>
<ext:Button ID="Button2" runat="server" Text="Remove Customer Css Class" Disabled="true" Icon="BulletBlack">
<Listeners>
<Click Handler="#{GroupTabPanel1}.removeCls('custom'); this.disable(); #{Button1}.enable();" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</BottomBar>
</ext:Panel>
</Items>
</ext:Viewport>
Last edited by fabricio.murta; Jun 06, 2017 at 6:43 PM.
