RadTabStrip + RadMultiPage + RadAjaxManager Problem

10 posts, 0 answers
  1. Katie
    Katie avatar
    17 posts
    Member since:
    Aug 2008

    Posted 06 Nov 2009 Link to this post

    I have a scenario where I have a RadTabStrip with 2 tabs and a RadMultiPage with 2 pages.  In the first page I have a RadGrid and the second page is a form. I am using RadAjaxManager to ajaxify the page. I want to be able to click an edit link from the RadGrid and have the multipage and tabstrip change to the form page.

    The problem I am having is when I click on edit, the RadMultipage changes, but the RadTabStrip does not. If I take the RadAjaxManager out then it works correctly.

    I have replicated the problem using a simple setup with just buttons in each page. Clicking the button should change both the RadTabStrip and RadMultipage.

    Here is my aspx code
        <telerik:RadTabStrip ID="RadTabStrip1" runat="server"   
            MultiPageID="RadMultiPage1">  
            <Tabs> 
                <telerik:RadTab runat="server" Text="List">  
                </telerik:RadTab> 
                <telerik:RadTab runat="server" Text="Form">  
                </telerik:RadTab> 
            </Tabs> 
        </telerik:RadTabStrip> 
        <telerik:RadMultiPage ID="RadMultiPage1" runat="server">  
            <telerik:RadPageView ID="RadPageView1" runat="server">  
                List View<br /><br /> 
                <asp:Button ID="Button1" runat="server" Text="Go to Form View" /> 
             </telerik:RadPageView> 
            <telerik:RadPageView ID="RadPageView2" runat="server" Width="100%">  
                Form View<br /><br /> 
                <asp:Button ID="Button2" runat="server" Text="Go to List View" /> 
             </telerik:RadPageView> 
        </telerik:RadMultiPage> 
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server"   
            Skin="Default" Transparency="1">  
        </telerik:RadAjaxLoadingPanel> 
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"   
            DefaultLoadingPanelID="RadAjaxLoadingPanel1">  
            <AjaxSettings> 
                <telerik:AjaxSetting AjaxControlID="RadTabStrip1">  
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" /> 
                        <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" /> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
                <telerik:AjaxSetting AjaxControlID="RadMultiPage1">  
                    <UpdatedControls> 
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" /> 
                        <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" /> 
                    </UpdatedControls> 
                </telerik:AjaxSetting> 
            </AjaxSettings> 
        </telerik:RadAjaxManager> 
     

    Here is the code behind
        Protected Sub Page_Load(ByVal sender As ObjectByVal e As System.EventArgs) Handles Me.Load  
     
            If Not Page.IsPostBack Then 
                RadTabStrip1.SelectedIndex = 0  
                RadMultiPage1.SelectedIndex = 0  
            End If 
        End Sub 
     
        Protected Sub Button1_Click(ByVal sender As ObjectByVal e As System.EventArgs) Handles Button1.Click  
            RadTabStrip1.SelectedIndex = 1  
            RadMultiPage1.SelectedIndex = 1  
        End Sub 
     
     
        Protected Sub Button2_Click(ByVal sender As ObjectByVal e As System.EventArgs) Handles Button2.Click  
            RadTabStrip1.SelectedIndex = 0  
            RadMultiPage1.SelectedIndex = 0  
        End Sub 
     

    If I take out the RadAjaxManager it works correctly.
    Using the RadAjaxManager the RadTabStrip does not update.  Any ideas?

    p.s. I have tried this with version 2009.2.701.20,  2009.2.826.20, 2009.3.1103.20 of  Telerik.Web.UI
  2. Paul
    Admin
    Paul avatar
    4281 posts

    Posted 09 Nov 2009 Link to this post

    Hi Jeff,

    Please find below your modified code snippet that works as expected.

    <form id="form1" runat="server">
        <telerik:RadScriptManager ID="radAjaxScriptManager1" runat="server">
        </telerik:RadScriptManager>
        <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1">
            <Tabs>
                <telerik:RadTab runat="server" Text="List">
                </telerik:RadTab>
                <telerik:RadTab runat="server" Text="Form">
                </telerik:RadTab>
            </Tabs>
        </telerik:RadTabStrip>
        <telerik:RadMultiPage ID="RadMultiPage1" runat="server">
            <telerik:RadPageView ID="RadPageView1" runat="server">
                List View<br />
                <br />
                <asp:Button ID="Button1" runat="server" Text="Go to Form View" />
            </telerik:RadPageView>
            <telerik:RadPageView ID="RadPageView2" runat="server" Width="100%">
                Form View<br />
                <br />
                <asp:Button ID="Button2" runat="server" Text="Go to List View" />
            </telerik:RadPageView>
        </telerik:RadMultiPage>
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default"
            Transparency="1">
        </telerik:RadAjaxLoadingPanel>
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadTabStrip1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                        <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="Button1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                        <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="Button2">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                        <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        </form>


    Kind regards,
    Paul
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Chen
    Chen avatar
    46 posts
    Member since:
    Oct 2010

    Posted 25 Oct 2010 Link to this post

    Can you please explain what was the problem and what had to change?

    Otherwise I have to reverse engineer and compare the two sets of code to analyze how it applies to my situation.
  5. Yana
    Admin
    Yana avatar
    4554 posts

    Posted 26 Oct 2010 Link to this post

    Hi Chen,

    The change is in the ajax settings of RadAjaxManager -  the buttons should update the tabstrip:

    <telerik:AjaxSetting AjaxControlID="Button1">
      <UpdatedControls>
         <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
         <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" />
      </UpdatedControls>
    </telerik:AjaxSetting>
    <telerik:AjaxSetting AjaxControlID="Button2">
      <UpdatedControls>
         <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
         <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" />
      </UpdatedControls>
    </telerik:AjaxSetting>


    Regards,
    Yana
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  6. Santhi
    Santhi avatar
    1 posts
    Member since:
    Dec 2011

    Posted 31 Dec 2011 Link to this post

    I have same issue.In first tab i have a radgrid and continue button.Whenever the user select a radgrid item and click the button,button OnClick event is not firing.
    Button have both onclick and onclientclick events.In onclientclick event,if user selects an item then select another tab,pageview and return true,otherwise return false.In onclick event i am populating the selected item values.But its not firing.
  7. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 03 Jan 2012 Link to this post

    Hello Santhi,

    Can you please elaborate a bit on your scenario? For example if you could send us some code snippet or a simplified runnable page that we could test locally would be very useful to us. Can you also clarify the version of the controls that you are using? 

    Greetings,
    Kate
    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
  8. Dorababu
    Dorababu avatar
    95 posts
    Member since:
    May 2012

    Posted 31 May 2012 Link to this post

    Hi Paul,
                   As per your code the radajax is getting displaying multiple radajax can you tell why.. check out my attachment
  9. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 05 Jun 2012 Link to this post

    Hello Dorababu,

    The issue that you get is due to the fact that when you press the button it updates both the RadTabStrip control and the RadMultiPage control. Hence, you get two loading panels. Please note also that the solution that Paul proposed is related to an old version of our controls. Therefore i would suggest that you use the code below instead:
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" >
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadTabStrip1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                        <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="Button1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                        <telerik:AjaxUpdatedControl ControlID="RadMultiPage1" LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="Button2">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                        <telerik:AjaxUpdatedControl ControlID="RadMultiPage1"  LoadingPanelID="RadAjaxLoadingPanel1"/>
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>

    All the best,
    Kate
    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.
  10. prabha
    prabha avatar
    22 posts
    Member since:
    Nov 2010

    Posted 06 Dec 2012 Link to this post

    Hi,

    I am also having the same issue. Rad Page View is updated, but the Tab selection is not highlighted - While clicking button which is inside rad page view. I am loading Rad Page view contents from usercontrol.

    My code is,
    <telerik:RadAjaxLoadingPanel runat="server" ID="LoadingPanel1">
                            <img src="../../../../../Images/loading.gif" alt="Loading..." />
                        </telerik:RadAjaxLoadingPanel>
                        <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1">
                            <AjaxSettings>
                                <telerik:AjaxSetting AjaxControlID="rtsTab1">
                                    <UpdatedControls>
                                        <telerik:AjaxUpdatedControl ControlID="rtsTab1" />
                                        <telerik:AjaxUpdatedControl ControlID="rmpPage1" LoadingPanelID="LoadingPanel1" />
                                    </UpdatedControls>
                                </telerik:AjaxSetting>
                                <telerik:AjaxSetting AjaxControlID="rmpPage1">
                                    <UpdatedControls>
                                        <telerik:AjaxUpdatedControl ControlID="rmpPage1" />
                                        <telerik:AjaxUpdatedControl ControlID="rtsTab1"/>
                                    </UpdatedControls>
                                </telerik:AjaxSetting>
                            </AjaxSettings>
                        </telerik:RadAjaxManager>

    ''' <summary>
    ''' This method is used to trigger a tab and make it selected
    ''' </summary>
    ''' <param name="tabValue"></param>
    ''' <remarks></remarks>
    Protected Sub TriggerTabClickEvent(ByVal tabValue As String)
        Dim tab As RadTab = rtsTab1.FindTabByValue(tabValue)
        tab.Selected = True
        rtsTab1_TabClick(Me, New RadTabStripEventArgs(tab))
        ' rtsTab1.SelectedIndex = rtsTab1.SelectedTab.Index - 1
        Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), "alert", "TabIndex:'" + rtsTab1.SelectedTab.Index.ToString(), True)
    End Sub

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

  11. Ambarish
    Ambarish avatar
    1 posts
    Member since:
    May 2013

    Posted 17 Feb 2014 in reply to Paul Link to this post

    excellent Job :) It saved my lot of Time
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017