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

RadMultiPage is not properly associated with RadTabStrip

3 Answers 68 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Matthew R Longhouse
Top achievements
Rank 1
Matthew R Longhouse asked on 05 Mar 2014, 04:49 PM
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"));

3 Answers, 1 is accepted

Sort by
0
Nencho
Telerik team
answered on 10 Mar 2014, 11:53 AM
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.

0
Matthew R Longhouse
Top achievements
Rank 1
answered on 10 Mar 2014, 07:20 PM
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);
                }
            }
        }
    }
}
0
Dimitar Terziev
Telerik team
answered on 12 Mar 2014, 07:52 AM
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.

 
Tags
TabStrip
Asked by
Matthew R Longhouse
Top achievements
Rank 1
Answers by
Nencho
Telerik team
Matthew R Longhouse
Top achievements
Rank 1
Dimitar Terziev
Telerik team
Share this question
or