RadMultiPage is not properly associated with RadTabStrip

4 posts, 0 answers
  1. Matthew R Longhouse
    Matthew R Longhouse avatar
    14 posts
    Member since:
    Apr 2007

    Posted 05 Mar 2014 Link to this post

    When a RadTabStrip was moved into our header container control it stopped working.  It no longer appears to be associating itself with the MultiPageView control.  Previously the tab strip was at the same level in the control tree as the multi page, however, it is now placed in a header control which uses a content template.  You can see from the client object create statement that the IDs for the multi page and the tabs are missing (I would think the control should fail at this point if an ID was specified and it couldn't find the control).  I tried setting the client ID explicitly to the ID field and that didn't work.

    I added the control named RadTabStrip1 for testing.
    Works
                <Efficio:EfficioContainer ID="cHeader" ContainerType="Tabbed" Width="658" runat="server">                
                <telerik:RadTabStrip ID="RadTabStrip1" SelectedIndex="0" MultiPageID="rmpMain" EnableEmbeddedSkins="False" Width="375" Align="Right" CssClass="tabStrip" runat="server">
                    <Tabs>
                        <telerik:RadTab PageViewID="pvGeneral" Text="Add Pending" Value="Opportunity" runat="server" />
                        <telerik:RadTab PageViewID="pvActivity" Text="Add Activity" Value="Activity" runat="server" />
                    </Tabs>
                </telerik:RadTabStrip>
                <Efficio:EfficioHeader ID="hTitle" HeaderType="Container" LeftWidth="220" runat="server">
                    <ContentTemplate>
                        <Efficio:EfficioHeaderMenu ID="hmConfiguration" Width="200" runat="server">
                            <ItemTemplate>                            
                                <Efficio:EfficioContainer ID="cConfiguration" ContainerType="White" runat="server">
                                    <Efficio:EfficioHeader ID="hConfiguration" Text="Configure" runat="server" />
                                    <asp:CheckBox ID="chkEnableStageTasks" Text="Stage Tasks Enabled" ClientIDMode="Static" runat="server" />
                                    <Efficio:EfficioButton ID="btnClose" Text="Close" OnClientClick="ConfigureStages();CloseHeaderMenu();return false;" runat="server"   />
                                </Efficio:EfficioContainer>
                            </ItemTemplate>
                        </Efficio:EfficioHeaderMenu>
                        <telerik:RadTabStrip ID="tsMain" SelectedIndex="0" MultiPageID="rmpMain" EnableEmbeddedSkins="False" Skin="EfficioSkin" Width="375" Align="Right" CssClass="tabStrip" OnClientTabSelected="tsMain_onTabSelected" runat="server">
                            <Tabs>
                                <telerik:RadTab PageViewID="pvGeneral" Text="Add Pending" Value="<%# TabName.Opportunity %>" runat="server" />
                                <telerik:RadTab PageViewID="pvActivity" Text="Add Activity" Value="<%# TabName.Activity %>" runat="server" />
                                <telerik:RadTab PageViewID="pvProposal" Text="Proposal" Value="<%# TabName.Proposal %>" runat="server" Visible="False" />
                                <telerik:RadTab PageViewID="pvHistory" Text="Activity History" Value="<%# TabName.History %>" Visible="false" runat="server" />
                            </Tabs>
                        </telerik:RadTabStrip>
                    </ContentTemplate>
                </Efficio:EfficioHeader>            
                <br class="clear" />            
                <telerik:RadMultiPage ID="rmpMain" SelectedIndex="0" CssClass="radMultiPage multiPageContainer" runat="server">

    Sys.Application.add_init(function() {
        $create(Telerik.Web.UI.RadTabStrip, {"_align":2,"_selectedIndex":0,"_skin":"Default","clientStateFieldID":"ctl00_cphM_cHeader_RadTabStrip1_ClientState","multiPageID":"ctl00_cphM_cHeader_rmpMain","selectedIndexes":["0"],"tabData":[{"value":"Opportunity","pageViewID":"ctl00_cphM_cHeader_pvGeneral"},{"value":"Activity","pageViewID":"ctl00_cphM_cHeader_pvActivity"}]}, null, null, $get("ctl00_cphM_cHeader_RadTabStrip1"));
    });


    Doesn't work
                <Efficio:EfficioContainer ID="cHeader" ContainerType="Tabbed" Width="658" runat="server">

                <Efficio:EfficioHeader ID="hTitle" HeaderType="Container" LeftWidth="220" runat="server">
                    <ContentTemplate>
                        <telerik:RadTabStrip ID="RadTabStrip1" SelectedIndex="0" MultiPageID="rmpMain" EnableEmbeddedSkins="False" Width="375" Align="Right" CssClass="tabStrip" runat="server">
                            <Tabs>
                                <telerik:RadTab PageViewID="pvGeneral" Text="Add Pending" Value="Opportunity" runat="server" />
                                <telerik:RadTab PageViewID="pvActivity" Text="Add Activity" Value="Activity" runat="server" />
                            </Tabs>
                        </telerik:RadTabStrip>

                        <Efficio:EfficioHeaderMenu ID="hmConfiguration" Width="200" runat="server">
                            <ItemTemplate>                            
                                <Efficio:EfficioContainer ID="cConfiguration" ContainerType="White" runat="server">
                                    <Efficio:EfficioHeader ID="hConfiguration" Text="Configure" runat="server" />
                                    <asp:CheckBox ID="chkEnableStageTasks" Text="Stage Tasks Enabled" ClientIDMode="Static" runat="server" />
                                    <Efficio:EfficioButton ID="btnClose" Text="Close" OnClientClick="ConfigureStages();CloseHeaderMenu();return false;" runat="server"   />
                                </Efficio:EfficioContainer>
                            </ItemTemplate>
                        </Efficio:EfficioHeaderMenu>
                        <telerik:RadTabStrip ID="tsMain" SelectedIndex="0" MultiPageID="rmpMain" EnableEmbeddedSkins="False" Skin="EfficioSkin" Width="375" Align="Right" CssClass="tabStrip" OnClientTabSelected="tsMain_onTabSelected" runat="server">
                            <Tabs>
                                <telerik:RadTab PageViewID="pvGeneral" Text="Add Pending" Value="<%# TabName.Opportunity %>" runat="server" />
                                <telerik:RadTab PageViewID="pvActivity" Text="Add Activity" Value="<%# TabName.Activity %>" runat="server" />
                                <telerik:RadTab PageViewID="pvProposal" Text="Proposal" Value="<%# TabName.Proposal %>" runat="server" Visible="False" />
                                <telerik:RadTab PageViewID="pvHistory" Text="Activity History" Value="<%# TabName.History %>" Visible="false" runat="server" />
                            </Tabs>
                        </telerik:RadTabStrip>
                    </ContentTemplate>
                </Efficio:EfficioHeader>            
                <br class="clear" />            
                <telerik:RadMultiPage ID="rmpMain" SelectedIndex="0" CssClass="radMultiPage multiPageContainer" runat="server">
                    <telerik:RadPageView ID="pvGeneral" runat="server">

    Sys.Application.add_init(function() {
        $create(Telerik.Web.UI.RadTabStrip, {"_align":2,"_selectedIndex":0,"_skin":"Default","clientStateFieldID":"ctl00_cphM_cHeader_hTitle_RadTabStrip1_ClientState","selectedIndexes":["0"],"tabData":[{"value":"Opportunity"},{"value":"Activity"}]}, null, null, $get("ctl00_cphM_cHeader_hTitle_RadTabStrip1"));
  2. Nencho
    Admin
    Nencho avatar
    1457 posts

    Posted 10 Mar 2014 Link to this post

    Hello Matthew,

    I tried to replicate the described issue, base on the provided code snippet, but to no avail. Therefore, I would suggest you to submit a support ticket, along with a runnable sample attached, in order to replicate the faced issue locally and provide you with the proper solution.

    Regards,
    Nencho
    Telerik

    DevCraft Q1'14 is here! Watch the online conference to see how this release solves your top-5 .NET challenges. Watch on demand now.

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Matthew R Longhouse
    Matthew R Longhouse avatar
    14 posts
    Member since:
    Apr 2007

    Posted 10 Mar 2014 in reply to Nencho Link to this post

    I've narrowed it down to happening only when a master page is used.  If a master page is used, and the tab strip is in the header control content template then it doesn't initialize the tab strip properly on the client side.

    I created a new master page along with 2 pages one of which uses the master page and one doesn't.  I also simplified the header control so that it just renders the controls in the template.  The tab strip works in the page that doesn't use the master page.

    Header control
    using System.Web.UI;

    namespace Efficio.Web.TestPages
    {
        [ParseChildren(true)]
        public class TabTestHeader : System.Web.UI.WebControls.CompositeControl
        {
            #region Fields

            private ITemplate _contentTemplate;

            #endregion

            #region public ITemplate ContentTemplate

            
            [TemplateInstance(TemplateInstance.Single)]
            public ITemplate ContentTemplate
            {
                get
                {
                    return _contentTemplate;
                }
                set
                {
                    _contentTemplate = value;
                }
            }

            #endregion

            protected override void CreateChildControls()
            {
                Controls.Clear();
                Control control = new Control();

                ITemplate template = _contentTemplate;

                if (template != null)
                {
                    template.InstantiateIn(control);
                    this.Controls.Add(control);
                }
            }

            protected override void Render(System.Web.UI.HtmlTextWriter writer)
            {
                if (Controls.Count > 0)
                {
                    foreach (Control control in this.Controls)
                    {
                        control.RenderControl(writer);
                    }
                }
            }
        }
    }
  5. Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1266 posts

    Posted 12 Mar 2014 Link to this post

    Hello,

    In order to associate a MultiPage control with the RadTabStrip via the MultiPageID property, the two controls should be ether in one and the same NamingContainer or on the same Page. In your case the two controls are not in one and the same NamingContainer since the RadTabStrip is in the content template of a composite control nor they are on the same page since a MasterPage is being used. In order to deal with this problem,  either the two control should be placed in the ContentTemplate or the association should be done manually from the code behind.

    Regards,
    Dimitar Terziev
    Telerik
     

    DevCraft Q1'14 is here! Watch the online conference to see how this release solves your top-5 .NET challenges. Watch on demand now.

     
Back to Top