Mar 09, 2011, 8:57 PM
Not able to add/remove tabs using DirectMethod
Hi guys, I've have spent a couple hours trying to do a simple thing without luck, hiding and showing tabs using a DirectMethod, I don't want the tabs to get destroyed but hidden and them bring them visible as needed, it's a simple conditional that hides or shows tabs added on the markup, I can't create them with javascript because they are too complex, can you please look at my code?
Thank you
Thank you
<%@ Page Language="C#" %>
<%@ 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">
<script runat="server">
protected void Button1_Click(object sender, DirectEventArgs e)
{
Panel2.Hidden = false;//doesn't work
Panel2.Show();//doesn't work
Panel3.Hidden = true;
Panel3.Hide();
X.MessageBox.Notify("Done", "It's done").Show();
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" language="javascript">
function Toggle() {
Ext.getCmp("TabPanel1").addTab("Panel2");
Ext.getCmp("TabPanel1").closeTab("Panel3");
alert('done');
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:ResourceManager ID="ResourceManager1" runat="server">
</ext:ResourceManager>
<ext:Button ID="Button1" runat="server" Text="Show Panel2 and Hide Panel3">
<DirectEvents>
<Click OnEvent="Button1_Click"></Click>
</DirectEvents>
</ext:Button>
<ext:Button ID="Button2" runat="server" Text="Show Panel2 and Hide Panel3 (Client Side)">
<Listeners>
<Click Handler="Toggle()" />
</Listeners>
</ext:Button>
<ext:TabPanel ID="TabPanel1" runat="server" Height="300">
<Items>
<ext:Panel ID="Panel1" runat="server" Title="Tab 1">
<Items>
</Items>
</ext:Panel>
<ext:Panel ID="Panel2" runat="server" Title="Tab 2 - Show me" Hidden="true">
<Items>
</Items>
</ext:Panel>
<ext:Panel ID="Panel3" runat="server" Title="Tab 3 - Hide me">
<Items>
</Items>
</ext:Panel>
</Items>
</ext:TabPanel>
</div>
</form>
</body>
</html>