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

<%@ 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>
        &nbsp;
        <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>