[CLOSED] How to toggle Tab closeability on the client?

  1. #1

    [CLOSED] How to toggle Tab closeability on the client?

    Hi,

    Please advise if it's possible to toggle the tab closable property on the client. It would have to remove/add the x-close button on the tab.
    Last edited by geoffrey.mcgill; Jul 03, 2012 at 8:50 PM. Reason: [CLOSED]
  2. #2
    Hi,

    I can suggest:

    1. Initially set up
    Closable="true"
    for all tabs which you'd like to manage its closable on the fly.

    2. Then to hide/show use:
    Ext.fly(Panel1.tabEl).child("a.x-tab-strip-close").hide();
    Ext.fly(Panel1.tabEl).child("a.x-tab-strip-close").show();
  3. #3
    Quote Originally Posted by Daniil View Post
    Hi,

    I can suggest:

    1. Initially set up
    Closable="true"
    for all tabs which you'd like to manage its closable on the fly.

    2. Then to hide/show use:
    Ext.fly(Panel1.tabEl).child("a.x-tab-strip-close").hide();
    Ext.fly(Panel1.tabEl).child("a.x-tab-strip-close").show();
    Thanks much Daniil, that works for hiding/showing the close button! Is there any way to disable/re-enable the tab context menu for closing the tab and closing All tabs?
  4. #4
    I can suggest the following solution.

    Example
    <%@ 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">
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.NET Example</title>
    
        <script type="text/javascript">
            var preventContextMenu = function () {
                return false;
            };
    
            var setDisabledMenu = function (tabPanel, disabled) {
                var tabCloseMenu;
    
                Ext.each(tabPanel.plugins, function (p) {
                    if (p instanceof Ext.ux.TabCloseMenu) {
                        tabCloseMenu = p;
                    }
                });
    
                if (disabled) {
                    tabCloseMenu.createMenu().on("beforeshow", preventContextMenu);
                } else {
                    tabCloseMenu.createMenu().un("beforeshow", preventContextMenu);
                }
            };
        </script>
    </head>
    <body>
        <ext:ResourceManager runat="server" />
    
        <ext:TabPanel ID="TabPanel1" runat="server">
            <Items>
                <ext:Panel runat="server" Title="Tab" Closable="true" />
            </Items>
            <Plugins>
                <ext:TabCloseMenu runat="server" />
            </Plugins>
        </ext:TabPanel>
    
        <ext:Button runat="server" Text="Disable">
            <Listeners>
                <Click Handler="setDisabledMenu(TabPanel1, true);" />
            </Listeners>
        </ext:Button>
    
        <ext:Button runat="server" Text="Enable">
            <Listeners>
                <Click Handler="setDisabledMenu(TabPanel1, false);" />
            </Listeners>
        </ext:Button>
    </body>
    </html>
  5. #5
    Thanks again Daniil!

    I was able to apply this solution to my scenario. You can mark this thread as resolved.

Similar Threads

  1. [CLOSED] Toggle button with different icons
    By jmcantrell in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jun 07, 2011, 6:03 PM
  2. [CLOSED] Menu toggle item..
    By mattwoberts in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Apr 07, 2011, 1:53 PM
  3. [CLOSED] Change toggle state form server or client side
    By caha76 in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Feb 19, 2011, 8:46 PM
  4. Toggle GridPanel Paging On/Off
    By kumbahara in forum 1.x Help
    Replies: 0
    Last Post: Nov 17, 2010, 8:42 PM
  5. [CLOSED] Toggle Button
    By amitpareek in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Dec 07, 2008, 3:09 PM

Posting Permissions