locked
Navigate to tab on tabcontainer RRS feed

  • Question

  • User1152242500 posted

    Hi,

    I have the following structure:

    Home Page

        MainView (User Control)

          TabContainer

    From a link placed on one of the tabs how do I navigate to another tab? I'd like to place the MainView User control into Umbraco where as far as I understand it I have no access to the pageLoad event for the parent page and so if possible would appreciate answers where code is not added to the Home Page.

    Thanks,

    M

    Thursday, September 12, 2013 4:30 PM

Answers

  • User2103319870 posted

    Try setting the activeTabIndex of tab using Javascript function

    Add the Jquery JS File

    <script src="Scripts/jquery-1.8.3.js"></script>
    <script type="text/javascript">
     function MoveTab(tn)
        {
          var container = $find('<%= TabContainer1.ClientID %>').set_activeTabIndex(tn);;
        }
    </script>

    HTML Mark Up

    <cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" CombineScripts="false">
            </cc1:ToolkitScriptManager>
            <cc1:TabContainer ID="TabContainer1" runat="server" Width="600">
                <cc1:TabPanel ID="TabPanel1" runat="server">
                    <HeaderTemplate>
                        Red Flower
                    </HeaderTemplate>
                    <ContentTemplate>
                        <a runat="server" id="lnkproceceed2tab" href="#" onclick="javascript:MoveTab('1')">Next
                        </a>
                    </ContentTemplate>
                </cc1:TabPanel>
                <cc1:TabPanel ID="TabPanel2" runat="server">
                    <HeaderTemplate>
                        Color List
                    </HeaderTemplate>
                    <ContentTemplate>
                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                    </ContentTemplate>
                </cc1:TabPanel>
            </cc1:TabContainer>
    Source URL



    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, September 12, 2013 4:38 PM

All replies

  • User2103319870 posted

    Try setting the activeTabIndex of tab using Javascript function

    Add the Jquery JS File

    <script src="Scripts/jquery-1.8.3.js"></script>
    <script type="text/javascript">
     function MoveTab(tn)
        {
          var container = $find('<%= TabContainer1.ClientID %>').set_activeTabIndex(tn);;
        }
    </script>

    HTML Mark Up

    <cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" CombineScripts="false">
            </cc1:ToolkitScriptManager>
            <cc1:TabContainer ID="TabContainer1" runat="server" Width="600">
                <cc1:TabPanel ID="TabPanel1" runat="server">
                    <HeaderTemplate>
                        Red Flower
                    </HeaderTemplate>
                    <ContentTemplate>
                        <a runat="server" id="lnkproceceed2tab" href="#" onclick="javascript:MoveTab('1')">Next
                        </a>
                    </ContentTemplate>
                </cc1:TabPanel>
                <cc1:TabPanel ID="TabPanel2" runat="server">
                    <HeaderTemplate>
                        Color List
                    </HeaderTemplate>
                    <ContentTemplate>
                        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                    </ContentTemplate>
                </cc1:TabPanel>
            </cc1:TabContainer>
    Source URL



    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, September 12, 2013 4:38 PM
  • User1152242500 posted

    Hi A2H,

    I'm sorry, I just realised my mistake. The link in question is on a User Control which is in turn on a tab. If I could trouble you again how would I go about this?

    Please ignore the above. Just realised the answer you've given will work perfectly and there is no need for the link to be in the child User Control.

    Thank you,

    M

    Thursday, September 12, 2013 5:00 PM