[Solved] RadTabStrip / RadMultiPage state lost when inside nested control in SharePoint web part

[William Cook]

Embedding a RadMultiPage / RadTabStrip directly into a SharePoint web part works fine, but for code organization I would like to nest them into a separate control. Once I do this, the control re-creation doesn't work (at least, not the ways I have tried it :)). Specifically, when the RadMultiPage / RadTabStrip are part of the WebPartWithTelerik class (which inherits from System.Web.UI.WebControls.WebParts.WebPart), the RadGrid controls on each page allow editing correctly; however, when they are moved down into the WebPartPanel class, clicking Edit on the RadGrid on either page causes the entire page to re-load, and the controls are not in edit mode as their state has been lost.

Scenario:
* RadTabStrip / RadMultiPage combo with two RadPageView objects.
* Each RadPageView contains a single RadGrid which retrieves data via LinqToSql data sources.
* MOSS web site using VSEWSS 1.3 to build the web part in VS 2008.

I've tried a few iterations of this (attemping to serialize the container object, etc.) with no success. Here's hoping there's a simple fix out there.

Thanks,

William Cook

using System;
using System.Runtime.InteropServices;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Serialization;

using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using Microsoft.SharePoint.WebPartPages;

using Telerik.Web.UI;

namespace WebPartWithTelerik
{
    [Guid("1d53c24d-161e-4fca-86b0-9a8f589e3ee9")]
    public class WebPartWithTelerik : System.Web.UI.WebControls.WebParts.WebPart
    {
        private WebPartPanel Panel;
        //{
        //    get { return (WebPartPanel)ViewState["Panel"]; }
        //    set { ViewState["Panel"] = value; }
        //}

        public WebPartWithTelerik()
        {
        }

        protected override void CreateChildControls()
        {
            base.CreateChildControls();

            // Add the controls to the page.
            this.Panel = new WebPartPanel();
            this.Controls.Add(this.Panel);
        }
    }

    public class WebPartPanel : Panel
    {
        private Telerik.Web.UI.RadMultiPage MultiPage;
        //{
        //    get { return (RadMultiPage)ViewState["MultiPage"]; }
        //    set { ViewState["MultiPage"] = value; }
        //}
        private Telerik.Web.UI.RadTabStrip TabStrip;
        //{
        //    get { return (RadTabStrip)ViewState["TabStrip"]; }
        //    set { ViewState["TabStrip"] = value; }
        //}

        public WebPartPanel()
        {
            this.ID = "WebPartPanelID";
        }


        protected override void CreateChildControls()
        {
            base.CreateChildControls();

            // Create a simple label to validate rendering of controls.
            Label label = new Label();
            label.Text = "Test web part for Telerik controls in a SharePoint web part.";
            this.Controls.Add(label);

            //this.ChildrenAsTriggers = true;
            //this.UpdateMode = UpdatePanelUpdateMode.Conditional;

            // Create two RadPageView objects.
            RadPageView pageOne = new RadPageView();
            pageOne.ID = "pageOne";
            RadPageView pageTwo = new RadPageView();
            pageTwo.ID = "pageTwo";

            // Create the RadMultiPage object.
            this.MultiPage = new RadMultiPage();
            this.MultiPage.ID = "multiPage";
            this.MultiPage.PageViewCreated += new RadMultiPageEventHandler(MultiPage_PageViewCreated);
            this.MultiPage.PageViews.Add(pageOne);
            this.MultiPage.PageViews.Add(pageTwo);

            // Create the RadTab objects.
            RadTab tabOne = new RadTab("One");
            tabOne.PageViewID = pageOne.UniqueID;
            RadTab tabTwo = new RadTab("Two");
            tabTwo.PageViewID = pageTwo.UniqueID;

            // Create the tabstrip.
            this.TabStrip = new RadTabStrip();
            this.TabStrip.ID = "tabStrip";
            this.TabStrip.MultiPageID = this.MultiPage.UniqueID;
            this.TabStrip.Tabs.Add(tabOne);
            this.TabStrip.Tabs.Add(tabTwo);

            // Add the controls to the page.
            this.Controls.Add(this.TabStrip);
            this.Controls.Add(this.MultiPage);
        }

        void MultiPage_PageViewCreated(object sender, RadMultiPageEventArgs e)
        {
            // Create a simple label to validate rendering of controls.
            Label label = new Label();
            label.Text = e.PageView.ID;
            e.PageView.Controls.Add(label);

            LinqDataSource dataSource = new LinqDataSource();
            DataClassesDataContext context = new DataClassesDataContext();
            dataSource.ContextTypeName = context.GetType().AssemblyQualifiedName; //"WebPartWithTelerik.DataClassesDataContext, WebPartWithTelerik, Version=1.0.0.0, Culture=neutral, PublicKeyToken=23df81aee7a34b62";
            context.Dispose();
            dataSource.EnableInsert = true;
            dataSource.EnableUpdate = true;

            // Create the grid for the page.
            RadGrid grid = new RadGrid();
            grid.AutoGenerateColumns = true;
            grid.AutoGenerateEditColumn = true;
            grid.AllowAutomaticInserts = true;
            grid.AllowAutomaticUpdates = true;
            grid.MasterTableView.DataKeyNames = new string[] { "TypeID" };
            switch (e.PageView.ID)
            {
                case "pageOne":
                    //dataSource.ID = "dataSourceOne";
                    dataSource.TableName = "TableOnes";
                    grid.ID = "gridOne";
                    grid.NeedDataSource += new GridNeedDataSourceEventHandler(grid_NeedDataSourceOne);
                    break;
                case "pageTwo":
                    //dataSource.ID = "dataSourceTwo";
                    dataSource.TableName = "TableTwos";
                    grid.ID = "gridTwo";
                    grid.NeedDataSource += new GridNeedDataSourceEventHandler(grid_NeedDataSourceTwo);
                    break;
            }

            // Bind the data source.
            //dataSource.DataBind();
            e.PageView.Controls.Add(dataSource);

            // Add the grid to the PageView.
            grid.DataSourceID = dataSource.UniqueID;
            grid.MasterTableView.ID = grid.ID + "_MasterTableView";
            e.PageView.Controls.Add(grid);
        }

        void grid_NeedDataSourceOne(object source, GridNeedDataSourceEventArgs e)
        {
            RadGrid grid = (RadGrid)source;
            grid.DataSourceID = "dataSourceOne";
        }
        void grid_NeedDataSourceTwo(object source, GridNeedDataSourceEventArgs e)
        {
            RadGrid grid = (RadGrid)source;
            grid.DataSourceID = "dataSourceTwo";
        }
    }
}

[Nikolay Rusev]

Hello William,

I suspect that RadGrid is not recreated on time on postback. Bellow links explains how you can create RadGrid programmatically:
http://demos.telerik.com/aspnet-ajax/grid/examples/hierarchy/definingstructure/defaultcs.aspx
http://demos.telerik.com/aspnet-ajax/grid/examples/programming/groupby/defaultcs.aspx

I will suggest you create your control on Init event. This should solve the state issue.

Kind regards,
Nikolay
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.