This is a migrated thread and some comments may be shown as answers.

Tabstrip with updatepanel

3 Answers 233 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Dorababu
Top achievements
Rank 1
Dorababu asked on 21 Jun 2012, 12:50 PM
Hi all how can I work with tabstrip inside update panel. I have designed as follows
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="radTabStripMultiPage.aspx.cs"
    Inherits="radTabStripMultiPage" %>
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head runat="server">
    <title></title>
    <link href="StyleSheet2.css" rel="stylesheet" type="text/css" />
    <link href="TabStrip.WebBlue.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="rad" runat="server">
    </telerik:RadScriptManager>
    <div>
        <telerik:RadWindowManager ID="RadWindowManager2" runat="server" VisibleOnPageLoad="false">
            <Shortcuts>
                <telerik:WindowShortcut CommandName="CloseAll" Shortcut="Esc" />
            </Shortcuts>
        </telerik:RadWindowManager>
        <telerik:RadWindowManager ID="RadWindowManager1" runat="server" Behavior="Default"
            InitialBehavior="None">
            <Windows>
                <telerik:RadWindow ID="RadWindow1" runat="server" Behaviors="Default" InitialBehaviors="None"
                    OpenerElementID="btn" Width="650" Height="480" VisibleOnPageLoad="false">
                    <ContentTemplate>
                        <telerik:RadComboBox ID="rdcmb" runat="server">
                            <Items>
                                <telerik:RadComboBoxItem Text="One" Value="One" />
                                <telerik:RadComboBoxItem Text="Two" Value="Two" />
                                <telerik:RadComboBoxItem Text="Three" Value="Three" />
                                <telerik:RadComboBoxItem Text="Four" Value="Four" />
                            </Items>
                        </telerik:RadComboBox>
                        <telerik:RadTextBox ID="rdText" runat="server">
                        </telerik:RadTextBox>
                        <telerik:RadButton ID="radbtn" runat="server" Text="Save">
                        </telerik:RadButton>
                    </ContentTemplate>
                </telerik:RadWindow>
            </Windows>
        </telerik:RadWindowManager>
        <asp:UpdatePanel ID="up1" runat="server">
            <ContentTemplate>
                <telerik:RadTabStrip ID="rdtabEmployee" runat="server" MultiPageID="rdmpPersonal"
                    UnSelectChildren="True" Skin="WebBlue" EnableEmbeddedSkins="False" ClickSelectedTab="True"
                    SelectedIndex="0" OnTabClick="tabClick">
                    <Tabs>
                        <telerik:RadTab runat="server" Text="Personal" PageViewID="rdpgPersonal">
                        </telerik:RadTab>
                        <telerik:RadTab runat="server" Text="Contact" PageViewID="rdpgContact">
                        </telerik:RadTab>
                        <telerik:RadTab runat="server" Text="Salary" PageViewID="RadPageView1">
                        </telerik:RadTab>
                        <telerik:RadTab runat="server" Text="Bank" PageViewID="RadPageView2">
                        </telerik:RadTab>
                        <telerik:RadTab runat="server" Text="Taxes" SelectedIndex="0">
                            <Tabs>
                                <telerik:RadTab runat="server" Text="Residence" PageViewID="rdpgResident">
                                </telerik:RadTab>
                                <telerik:RadTab runat="server" Text="Work" PageViewID="rdpgWork">
                                </telerik:RadTab>
                            </Tabs>
                        </telerik:RadTab>
                        <telerik:RadTab runat="server" Text="Demo">
                        </telerik:RadTab>
                        <telerik:RadTab runat="server" Text="Demo1">
                        </telerik:RadTab>
                        <telerik:RadTab runat="server" Text="Demo2">
                        </telerik:RadTab>
                        <telerik:RadTab runat="server" Text="Demo1">
                        </telerik:RadTab>
                    </Tabs>
                </telerik:RadTabStrip>
                <telerik:RadMultiPage ID="rdmpPersonal" runat="server">
                    <telerik:RadPageView ID="rdpgPersonal" runat="server" Selected="true">
                        <telerik:RadPanelBar runat="server" ID="rdpnlPersonal" ExpandMode="FullExpandedItem"
                            Skin="Vista" EnableEmbeddedSkins="false" Width="550px">
                            <Items>
                                <telerik:RadPanelItem Expanded="true" Text="Employee Personal Information" runat="server"
                                    Selected="true">
                                    <Items>
                                        <telerik:RadPanelItem Value="AccountInformation" runat="server">
                                            <ItemTemplate>
                                                <label>
                                                    Demop
                                                </label>
                                                <telerik:RadButton ID="rdbtnwhAnother" Text="Add WithHolding" runat="server" ButtonType="LinkButton"
                                                    OnClick="rdbtnwhAnother_Click">
                                                </telerik:RadButton>
                                            </ItemTemplate>
                                        </telerik:RadPanelItem>
                                    </Items>
                                </telerik:RadPanelItem>
                            </Items>
                        </telerik:RadPanelBar>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="rdpgContact" runat="server">
                        <label>
                            Demo Contact
                        </label>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="RadPageView1" runat="server">
                        <label>
                            Salary Demo
                        </label>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="RadPageView2" runat="server">
                        <label>
                            Demo Bank
                        </label>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="rdpgResident" runat="server">
                        <label>
                            Resident Demo
                        </label>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="rdpgWork" runat="server">
                        <label>
                            Work Demo
                        </label>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="RadPageView3" runat="server">
                        <label>
                            Work Demo
                        </label>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="RadPageView4" runat="server">
                        <label>
                            Work Demo
                        </label>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="RadPageView5" runat="server">
                        <label>
                            Work Demo
                        </label>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="RadPageView6" runat="server">
                        <label>
                            Work Demo
                        </label>
                    </telerik:RadPageView>
                    <telerik:RadPageView ID="RadPageView7" runat="server">
                        <label>
                            Work Demo
                        </label>
                    </telerik:RadPageView>
                </telerik:RadMultiPage>
            </ContentTemplate>
        </asp:UpdatePanel>
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Width="16px">
        </telerik:RadAjaxLoadingPanel>
        <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="rdbtnwhAnother">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadWindowManager1" LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="rdmpPersonal">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="rdtabEmployee" />
                        <telerik:AjaxUpdatedControl ControlID="rdmpPersonal" LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="rdtabEmployee">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="rdtabEmployee" />
                        <telerik:AjaxUpdatedControl ControlID="rdmpPersonal" LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
    </div>
    </form>
</body>
</html>

This is my code


protected void tabClick(object sender, RadTabStripEventArgs e)
    {
        switch (e.Tab.Text)
        {
            case "Personal":
                break;
        }
        if (e.Tab.Text == "Taxes")
        {
            RadTab tab1 = rdtabEmployee.FindTabByText("Taxes");
            tab1.Selected = true;
            tab1.SelectedIndex = 0;
            RadPageView pv1 = rdmpPersonal.FindPageViewByID("rdpgResident");
            pv1.Selected = true;
        }
        if (e.Tab.Text == "Residence")
        {
            RadTab tab1 = rdtabEmployee.FindTabByText("Taxes");
            tab1.Selected = true;
            tab1.SelectedIndex = 0;
            RadPageView pv1 = rdmpPersonal.FindPageViewByID("rdpgResident");
            pv1.Selected = true;
        }
        if (e.Tab.Text == "Work")
        {
            RadTab tab1 = rdtabEmployee.FindTabByText("Taxes");
            tab1.Selected = true;
            tab1.SelectedIndex = 1;
            RadPageView pv1 = rdmpPersonal.FindPageViewByID("rdpgWork");
            pv1.Selected = true;
        }
    }

But on clicking the tab activating only one i.e If i select Tab 2 and then Tab3 tab3 is not getting selected can any one help

3 Answers, 1 is accepted

Sort by
0
Dimitar Terziev
Telerik team
answered on 26 Jun 2012, 10:56 AM
Hi,

The problem with the particular implementation is the existence of both RadAjaxManager and UpdatePanel. Please remove either the RadAjaxManager or the UpdatePanel and the problem should be resolved.

All the best,
Dimitar Terziev
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Dorababu
Top achievements
Rank 1
answered on 26 Jun 2012, 11:07 AM
Can't we do with both functionality working
0
Dimitar Terziev
Telerik team
answered on 27 Jun 2012, 01:06 PM
Hello,

It's not supported to use both controls in this particular case because they are mutually exclusive. It's similar to put the existing UpdatePanel inside another UpdatePanel. Since all of the controls inside the update panel will perform an Ajax request and will be updated after that, the usage of RadAjaxManager is not only unnecessary, but more importantly is not supported because this way there will be two Ajax request which will interfere with one other.

Regards,
Dimitar Terziev
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
TabStrip
Asked by
Dorababu
Top achievements
Rank 1
Answers by
Dimitar Terziev
Telerik team
Dorababu
Top achievements
Rank 1
Share this question
or