Ajaxifying RadTabStrip/RadMultiPage within NestedViewTemplate

5 posts, 0 answers
  1. Neil
    Neil avatar
    13 posts
    Member since:
    Jan 2013

    Posted 15 Feb 2013 Link to this post

    I have a hierarchical RadGrid which contains a NestedViewTemplate that has a Panel, TabStrip, and MultiPage inside of it.  On row expand, an ajax request is fired and loads the first tab.  However I would like all of the subsequent tabs to be ajaxified as well.  How can I achieve this?  

    Even when I use Design mode and try to add these AjaxControl/AjaxUpdatedControl relationships, I do not have an option for my NestedViewTemplate, TabStrip, and MultiPage (while they are inside the grid)

    My code is:

    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
      <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadMenu1">
          <UpdatedControls>
            <telerik:AjaxUpdatedControl ControlID="RadGrid1" UpdatePanelHeight="100%"/>
          </UpdatedControls>
        </telerik:AjaxSetting>
        <telerik:AjaxSetting AjaxControlID="RadGrid1">
          <UpdatedControls>
            <telerik:AjaxUpdatedControl ControlID="RadGrid1"/>
          </UpdatedControls>
        </telerik:AjaxSetting>
          <telerik:AjaxSetting AjaxControlID="RadTabStrip1">
              <UpdatedControls>
                  <telerik:AjaxUpdatedControl ControlID="NestedViewPanel1" />
              </UpdatedControls>
          </telerik:AjaxSetting>
          <telerik:AjaxSetting AjaxControlID="RadMultiPage1">
              <UpdatedControls>
                  <telerik:AjaxUpdatedControl ControlID="NestedViewPanel1" />
              </UpdatedControls>
          </telerik:AjaxSetting>
      </AjaxSettings>
    </telerik:RadAjaxManager>

    <telerik:RadGrid ID="RadGrid1"
                     runat="server"
                     DataKeyNames="PrimaryKey"
                     OnItemCommand="RadGrid1_ItemCommand"
                     OnNeedDataSource="RadGrid1_OnNeedDataSource"
                     EnableViewState="false">
      <MasterTableView>
        <NestedViewSettings>
          <ParentTableRelation>
            <telerik:GridRelationFields DetailKeyField="PrimaryKey" MasterKeyField="PrimaryKey" />
          </ParentTableRelation>
        </NestedViewSettings>
        <NestedViewTemplate>
         <asp:Panel ID="NestedViewPanel1" runat="server" CssClass="viewWrap bordered-bottom">
            <telerik:RadTabStrip runat="server" ID="RadTabStrip1" AutoPostBack="true" MultiPageID="RadMultiPage1"></telerik:RadTabStrip>
            <telerik:RadMultiPage runat="server" ID="RadMultiPage1" EnableEmbeddedScripts="true"></telerik:RadMultiPage>
          </asp:Panel>
        </NestedViewTemplate>
      </MasterTableView>
    </telerik:RadGrid>

    And my tabs are created programmatically:

    string[] testing = { "Test1", "Test2", "Test3", "Test4", "Test5", "Test6" };
     
    foreach (string tabName in testing)
    {
        RadTab tab = new RadTab();
        tab.Text = tabName;
        RadTabStrip1.Tabs.Add(tab);
        RadPageView pageView = new RadPageView();
        RadMultiPage1.PageViews.Add(pageView);
        pageView.ID = "Page" + RadTabStrip1.Tabs.Count.ToString();
        pageView.Controls.Add(new LiteralControl(pageView.ID);
        RadTabStrip1.SelectedIndex = 0;
        RadTabStrip1.MultiPageID = RadMultiPage1.ID;
        RadTabStrip1.DataBind();
    }
  2. Neil
    Neil avatar
    13 posts
    Member since:
    Jan 2013

    Posted 19 Feb 2013 Link to this post

    Is this scenario possible?
  3. Kostadin
    Admin
    Kostadin avatar
    1733 posts

    Posted 20 Feb 2013 Link to this post

    Hi Neil,

    Note that when you ajaxified a RadGrid all other nested controls in it will be ajaxified as well. So in your case you have to set your AjaxManager as it is shown in the following code snippet.
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1">
        <telerik:AjaxSetting AjaxControlID="RadGrid1">
          <UpdatedControls>
            <telerik:AjaxUpdatedControl ControlID="RadGrid1"/>
          </UpdatedControls>
        </telerik:AjaxSetting>
    </telerik:RadAjaxManager>


    Kind regards,
    Kostadin
    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.
  4. Neil
    Neil avatar
    13 posts
    Member since:
    Jan 2013

    Posted 20 Feb 2013 Link to this post

    Hi Kostadin,

    In my original code I had the Ajax settings for the RadGrid correct:

    <telerik:AjaxSetting AjaxControlID="RadGrid1">
      <UpdatedControls>
        <telerik:AjaxUpdatedControl ControlID="RadGrid1"/>
      </UpdatedControls>
    </telerik:AjaxSetting>

    However, this is not ajaxifying my tabstrip correctly.  If I have 3 tabs, when I expand a row, the content of all 3 tabs is loaded at once.  I would like for each tab to be it's own seperate trip back to the server for content.

    How can I achieve this?
  5. Kostadin
    Admin
    Kostadin avatar
    1733 posts

    Posted 25 Feb 2013 Link to this post

    Hello Neil,

    What you are trying to achieve is not possible. I suggest you to check out the following help article where some useful tips and tricks about ajaxifying specific controls are described.

    Greetings,
    Kostadin
    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.
Back to Top