May 21, 2014, 12:36 PM
Really -- I just picked up a tab example and added the tab config from my earlier post.
Here you go. As I said in the post the key is rendertobody=false. And you can see why I ended up overriding the css and adding margins. Not overly sure what other workarounds there are for this.
Here you go. As I said in the post the key is rendertobody=false. And you can see why I ended up overriding the css and adding margins. Not overly sure what other workarounds there are for this.
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>Show and Hide Tabs - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" />
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<h1>Show and Hide Tabs</h1>
<ext:TabPanel ID="TabPanel1" runat="server" Width="800" Height="300">
<Items>
<ext:Panel ID="Tab1" Title="Tab1" runat="server" Closable="false" CloseAction="Hide" Html="Tab1">
<TabConfig runat="server">
<Plugins>
<ext:Badge HideEmpty="false" RenderToBody="false" runat="server" id="test" Text="1"></ext:Badge>
</Plugins>
</TabConfig>
</ext:Panel>
<ext:Panel ID="Tab2" Title="Tab2" runat="server" Closable="true" CloseAction="Hide" Html="Tab2">
<Listeners>
<Close Handler="#{ShowTab2}.setDisabled(false);" />
</Listeners>
</ext:Panel>
<ext:Panel ID="Tab3" Title="Tab3" runat="server" Closable="true" CloseAction="Hide" Html="Tab3">
<Listeners>
<Close Handler="#{ShowTab3}.setDisabled(false);" />
</Listeners>
</ext:Panel>
<ext:Panel ID="Tab4" Title="Tab4" runat="server" Closable="true" CloseAction="Hide" Html="Tab4">
<Listeners>
<Close Handler="#{ShowTab4}.setDisabled(false);" />
</Listeners>
</ext:Panel>
<ext:Panel ID="Tab5" Title="Tab5 - Close Event" runat="server" Closable="true" CloseAction="Destroy">
<Content>
Tab5 with CloseAction='Close' (after closing the tab can't be reshow)
</Content>
<Listeners>
<Close Handler="alert('Tab5 has been closed');" />
</Listeners>
</ext:Panel>
</Items>
<Bin>
<ext:Panel ID="Tab6" Title="Tab6" runat="server" Closable="true" CloseAction="Hide" Hidden="true" Html="PreHidden Tab6">
<Listeners>
<Close Handler="#{ShowTab6}.setDisabled(false);" />
</Listeners>
</ext:Panel>
</Bin>
<BottomBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:Button ID="CloseTab1" runat="server" Text="Close Tab1">
<Listeners>
<Click Handler="#{TabPanel1}.closeTab(#{Tab1});this.setDisabled(true);#{ShowTab1}.setDisabled(false);" />
</Listeners>
</ext:Button>
<ext:ToolbarFill />
<ext:Button ID="ShowTab1" runat="server" Text="Show Tab1" Disabled="true">
<Listeners>
<Click Handler="#{TabPanel1}.addTab(#{Tab1});this.setDisabled(true);#{CloseTab1}.setDisabled(false);" />
</Listeners>
</ext:Button>
<ext:Button ID="ShowTab2" runat="server" Text="Show Tab2" Disabled="true">
<Listeners>
<Click Handler="#{TabPanel1}.addTab(#{Tab2});this.setDisabled(true);" />
</Listeners>
</ext:Button>
<ext:Button ID="ShowTab3" runat="server" Text="Show Tab3 at begin" Disabled="true">
<Listeners>
<Click Handler="#{TabPanel1}.addTab(#{Tab3}, 0);this.setDisabled(true);" />
</Listeners>
</ext:Button>
<ext:Button ID="ShowTab4" runat="server" Text="Show Tab4 without activate" Disabled="true">
<Listeners>
<Click Handler="#{TabPanel1}.addTab(#{Tab4}, false);this.setDisabled(true);" />
</Listeners>
</ext:Button>
<ext:Button ID="ShowTab6" runat="server" Text="Show Tab6">
<Listeners>
<Click Handler="#{TabPanel1}.addTab(#{TabPanel1}.bin[0]);this.setDisabled(true);" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</BottomBar>
</ext:TabPanel>
</form>
</body>
</html>
Last edited by CanopiusApplications; May 21, 2014 at 3:27 PM.