or
Hello,
In my webpage I try to add a user control into RadPanelBar during ItemDataBound event. The user control showed up correctly after the 1st page load, but if user do post back the adding control is disappeared. I figured it could be related to viewstate mismatch, so I try give control a unique ID but problem still persist.
Any help is very appreciated!
Here is my test page code: http://209.200.250.235/Dynamic_panelbar_test.zip
Thanks.
(test.aspx)
| <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="test" %> | |
| <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> | |
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | |
| <html xmlns="http://www.w3.org/1999/xhtml" style="height: 100%; width: 100%; margin: 0px; | |
| padding: 0px; overflow: hidden;"> | |
| <head runat="server"> | |
| <title></title> | |
| </head> | |
| <body style="height: 100%; width: 100%; margin: 0px; padding: 0px; overflow: hidden;"> | |
| <form runat="server"> | |
| <telerik:RadScriptManager ID="uxRadScriptManager" runat="server"> | |
| </telerik:RadScriptManager> | |
| <telerik:RadAjaxManager ID="uxRadAjaxManager" runat="server"> | |
| </telerik:RadAjaxManager> | |
| <telerik:RadPanelBar ID="uxRadMenuBarML" runat="server" BorderStyle="None" BorderWidth="0px" Height="372px" | |
| PersistStateInCookie="True" Width="400px" OnItemDataBound="uxRadMenuBarML_ItemDataBound" | |
| OnItemClick="uxRadMenuBarML_ItemClick" Style="" Skin="Office2007" EnableEmbeddedSkins="true"> | |
| </telerik:RadPanelBar> | |
| </form> | |
| </body> | |
| </html> | |
| using System; | |
| using System.Collections.Generic; | |
| using System.Linq; | |
| using System.Web; | |
| using System.Web.UI; | |
| using System.Web.UI.WebControls; | |
| using Telerik.Web.UI; | |
| using System.Globalization; | |
| [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Naming", "CA1709:IdentifiersShouldBeCasedCorrectly", MessageId = "test")] | |
| public partial class test : System.Web.UI.Page | |
| { | |
| private List<LFMenuBarDataItem> _menuBarDataItem; | |
| protected void Page_Load(object sender, EventArgs e) | |
| { | |
| //enable AJAX update on PanelBar | |
| RadAjaxManager.GetCurrent(Page).AjaxSettings.AddAjaxSetting(this.uxRadMenuBarML, this.uxRadMenuBarML); | |
| } | |
| protected override void OnInit(EventArgs e) | |
| { | |
| base.OnInit(e); | |
| _menuBarDataItem = new List<LFMenuBarDataItem>(); | |
| //----------- | |
| AddMenuBarItem(0, "Search", "~/UCSearch.ascx"); | |
| AddMenuBarItem(1, null, "Home", "", "", false, false); | |
| AddMenuBarItem(2, null, "My Inbox", "", "", false, false); | |
| AddMenuBarItem(3, 1, "dummy item 1", "", "", false, false); | |
| AddMenuBarItem(4, 2, "dummy item 2", "", "", false, false); | |
| //----------- | |
| uxRadMenuBarML.DataTextField = "Title"; | |
| uxRadMenuBarML.DataFieldID = "ID"; | |
| uxRadMenuBarML.DataFieldParentID = "ParentID"; | |
| uxRadMenuBarML.DataSource = _menuBarDataItem; | |
| uxRadMenuBarML.DataBind(); | |
| } | |
| /// <summary> | |
| /// Adds the menu bar item. (used by presenter to set menu items) | |
| /// </summary> | |
| /// <param name="id">The id.</param> | |
| /// <param name="parentId">The parent id.</param> | |
| /// <param name="title">The title.</param> | |
| /// <param name="userControlPath">The user control path.</param> | |
| /// <param name="imagePath">The left side image path.</param> | |
| /// <param name="isPinDisplayed">if set to <c>true</c> [current pin is displayed].</param> | |
| /// <param name="isMenuExpanded">if set to <c>true</c> [current menu is expanded].</param> | |
| public void AddMenuBarItem(int id, int? parentId, string title, string userControlPath, string imagePath, bool isPinDisplayed, bool isMenuExpanded) | |
| { | |
| LFMenuBarDataItem menuBarDataItem = new LFMenuBarDataItem | |
| { | |
| Id = id, | |
| ParentId = parentId, | |
| Title = title, | |
| PagePath = userControlPath, | |
| ImagePath = imagePath, | |
| IsPinDisplayed = isPinDisplayed, | |
| IsMenuExpanded = isMenuExpanded, | |
| IsNestedUserControl = false | |
| }; | |
| _menuBarDataItem.Add(menuBarDataItem); | |
| } | |
| /// <summary> | |
| /// Adds the menu bar item. (used by presenter to set menu items) | |
| /// -this overload is used to install nested user control menu item | |
| /// </summary> | |
| /// <param name="id">The id.</param> | |
| /// <param name="nestUserControlPath">The nest user control path.</param> | |
| public void AddMenuBarItem(int id, string title, string nestUserControlPath) | |
| { | |
| LFMenuBarDataItem menuBarDataItem = new LFMenuBarDataItem | |
| { | |
| Id = id, | |
| Title = title, | |
| NestedUserControlPath = nestUserControlPath, | |
| IsNestedUserControl = true | |
| }; | |
| _menuBarDataItem.Add(menuBarDataItem); | |
| } | |
| /// <summary> | |
| /// Handles the ItemClick event of the uxRadMenuBarML control. | |
| /// </summary> | |
| /// <param name="sender">The source of the event.</param> | |
| /// <param name="e">The <see cref="Telerik.Web.UI.RadPanelBarEventArgs"/> instance containing the event data.</param> | |
| protected void uxRadMenuBarML_ItemClick(object sender, RadPanelBarEventArgs e) | |
| { | |
| } | |
| /// <summary> | |
| /// Handles the ItemDataBound event of the uxRadMenuBarML control. | |
| /// </summary> | |
| /// <param name="sender">The source of the event.</param> | |
| /// <param name="e">The <see cref="Telerik.Web.UI.RadPanelBarEventArgs"/> instance containing the event data.</param> | |
| protected void uxRadMenuBarML_ItemDataBound(object sender, RadPanelBarEventArgs e) | |
| { | |
| LFMenuBarDataItem item = (LFMenuBarDataItem)e.Item.DataItem; | |
| if (item.IsNestedUserControl) // nested user control | |
| { | |
| //Control ctl = Page.LoadControl(item.NestedUserControlPath); // load user control | |
| Button ctl = new Button(); // here we create a dummy button control for test | |
| ctl.Text = "I am a test button. Click me and I should not disappear"; | |
| ctl.ID = "TestButton" + Guid.NewGuid().ToString(); | |
| RadPanelItem radPanelItem = new RadPanelItem(); | |
| radPanelItem.Controls.Add(ctl); | |
| e.Item.Items.Clear(); | |
| e.Item.Items.Add(radPanelItem); | |
| } | |
| else // normal menubar item | |
| { | |
| e.Item.ImageUrl = item.ImagePath; | |
| } | |
| e.Item.Value = item.Id.ToString(CultureInfo.InvariantCulture); | |
| e.Item.Expanded = item.IsMenuExpanded; | |
| } | |
| /// <summary> | |
| /// Data class stores menu bar data item | |
| /// </summary> | |
| internal class LFMenuBarDataItem | |
| { | |
| public bool IsNestedUserControl | |
| { | |
| get; | |
| set; | |
| } | |
| [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Performance", "CA1811:AvoidUncalledPrivateCode")] | |
| public bool IsPinDisplayed | |
| { | |
| get; | |
| set; | |
| } | |
| public bool IsMenuExpanded | |
| { | |
| get; | |
| set; | |
| } | |
| [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Performance", "CA1811:AvoidUncalledPrivateCode")] | |
| public string Title | |
| { | |
| get; | |
| set; | |
| } | |
| public int Id | |
| { | |
| get; | |
| set; | |
| } | |
| [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Performance", "CA1811:AvoidUncalledPrivateCode")] | |
| public int? ParentId | |
| { | |
| get; | |
| set; | |
| } | |
| public string ImagePath | |
| { | |
| get; | |
| set; | |
| } | |
| [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Performance", "CA1811:AvoidUncalledPrivateCode")] | |
| public string PagePath | |
| { | |
| get; | |
| set; | |
| } | |
| [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Performance", "CA1811:AvoidUncalledPrivateCode")] | |
| public string NestedUserControlPath | |
| { | |
| get; | |
| set; | |
| } | |
| } | |
| } | |
| //------------------------------------------------------------------------------ | |
| // <auto-generated> | |
| // This code was generated by a tool. | |
| // Runtime Version:2.0.50727.3053 | |
| // | |
| // Changes to this file may cause incorrect behavior and will be lost if | |
| // the code is regenerated. | |
| // </auto-generated> | |
| //------------------------------------------------------------------------------ | |
| public partial class test { | |
| /// <summary> | |
| /// uxRadScriptManager control. | |
| /// </summary> | |
| /// <remarks> | |
| /// Auto-generated field. | |
| /// To modify move field declaration from designer file to code-behind file. | |
| /// </remarks> | |
| protected global::Telerik.Web.UI.RadScriptManager uxRadScriptManager; | |
| /// <summary> | |
| /// uxRadAjaxManager control. | |
| /// </summary> | |
| /// <remarks> | |
| /// Auto-generated field. | |
| /// To modify move field declaration from designer file to code-behind file. | |
| /// </remarks> | |
| protected global::Telerik.Web.UI.RadAjaxManager uxRadAjaxManager; | |
| /// <summary> | |
| /// uxRadMenuBarML control. | |
| /// </summary> | |
| /// <remarks> | |
| /// Auto-generated field. | |
| /// To modify move field declaration from designer file to code-behind file. | |
| /// </remarks> | |
| protected global::Telerik.Web.UI.RadPanelBar uxRadMenuBarML; | |
| } | |
| <div> |
| <asp:ScriptManager ID="ScriptManager1" runat="server"> |
| </asp:ScriptManager> |
| <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> |
| <AjaxSettings> |
| <telerik:AjaxSetting AjaxControlID="MenuRadPanelBar"> |
| <UpdatedControls> |
| <telerik:AjaxUpdatedControl ControlID="MenuRadPanelBar" /> |
| <telerik:AjaxUpdatedControl ControlID="panel1" /> |
| </UpdatedControls> |
| </telerik:AjaxSetting> |
| </AjaxSettings> |
| </telerik:RadAjaxManager> |
| <telerik:RadSplitter ID="RadSplitter1" BorderColor="White" Height="100%" Width="100%" runat="server" Orientation="Vertical"> |
| <telerik:RadPane runat="server" Width="210px" ID="TopPane"> |
| <telerik:RadSplitter ID="RadSplitter4" BorderColor="White" runat="server" Orientation="Horizontal"> |
| <telerik:RadPane ID="RadPane1" Height="100px" runat="server"> |
| <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" /> |
| </telerik:RadPane> |
| <telerik:RadSplitBar ID="RadSplitBar2" BorderColor="White" Visible="false" runat="server" /> |
| <telerik:RadPane ID="RadPane2" runat="server" > |
| <telerik:RadPanelBar Height="600px" Width="190px" ID="MenuRadPanelBar" runat="server" |
| Skin="Outlook" ExpandMode="FullExpandedItem" |
| BackColor="#e8e8e8" onitemclick="MenuRadPanelBar_ItemClick"> |
| <Items> |
| <telerik:RadPanelItem runat="server" Text="Manage" > |
| </telerik:RadPanelItem> |
| </Items> |
| <ExpandAnimation Type="None" Duration="100"></ExpandAnimation> |
| </telerik:RadPanelBar> |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </telerik:RadPane> |
| <telerik:RadSplitBar runat="server" ID="RadSplitBar1" BorderColor="White" Visible="false" /> |
| <telerik:RadPane runat="server" ID="MiddlePane"> |
| <telerik:RadSplitter ID="RadSplitter2" BorderColor="White" runat="server" Orientation="Horizontal"> |
| <telerik:RadPane ID="MiddleLeft" Height="100px" runat="server"> |
| </telerik:RadPane> |
| <telerik:RadSplitBar ID="RadSplitter3" BorderColor="White" Visible="false" runat="server" /> |
| <telerik:RadPane ID="MiddleRight" runat="server" > |
| <asp:Panel ID="Panel1" runat="server"> |
| <iframe id="load" runat="server" ></iframe> |
| </asp:Panel> |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </telerik:RadPane> |
| </telerik:RadSplitter> </div> |
| protected void MenuRadPanelBar_ItemClick(object sender, Telerik.Web.UI.RadPanelBarEventArgs e) |
| { |
| HtmlControl frame1 = (HtmlControl)this.FindControl("load"); |
| frame1.Attributes["src"] = "Default2.aspx"; |
| } |
| protected void btnFilter_Click(object sender, EventArgs e) |
| { |
| string filter = ""; |
| switch (cboFilter.SelectedValue) |
| { |
| case "AccountNumber": |
| { |
| filter = String.Format("(AccountNumber LIKE '%{0}%')", txtFilter.Text.Trim()); |
| break; |
| } |
| case "DateRange": |
| { |
| if ((rdpDateFrom.SelectedDate != null) && (rdpDateTo.SelectedDate != null)) |
| { |
| filter = String.Format("(DateFrom >= {0}) AND (DateTo <= {1})", rdpDateFrom.SelectedDate, rdpDateTo.SelectedDate); |
| } |
| else if ((rdpDateFrom.SelectedDate != null) && (rdpDateTo.SelectedDate == null)) |
| { |
| filter = String.Format("(DateFrom >= {0})", rdpDateFrom.SelectedDate); |
| } |
| else if ((rdpDateFrom.SelectedDate == null) && (rdpDateTo.SelectedDate != null)) |
| { |
| filter = String.Format("(DateTo <= {0})", rdpDateTo.SelectedDate); |
| } |
| break; |
| } |
| case "FullName": |
| { |
| filter = String.Format("(FullName LIKE '%{0}%')", txtFilter.Text.Trim()); |
| break; |
| } |
| case "PhoneNumber": |
| { |
| filter = String.Format("(PhoneNumber LIKE '%{0}%')", txtFilter.Text.Trim()); |
| break; |
| } |
| } |
| rgBills.MasterTableView.FilterExpression = filter; |
| rgBills.MasterTableView.DataBind(); |
| } |
| <telerik:RadGrid ID="rgBills" runat="server" Skin="Web20" |
| AllowPaging="True" AllowSorting="True" GridLines="None" DataSourceID="dsBills" |
| OnItemDataBound="rgBills_ItemDataBound" OnItemCommand="rgBills_ItemCommand" |
| ShowFooter="True" OnSelectedIndexChanged="rgBills_SelectedIndexChanged" > |
| <HeaderContextMenu EnableTheming="True"> |
| <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> |
| </HeaderContextMenu> |
| <ClientSettings> |
| <Selecting AllowRowSelect="true" /> |
| </ClientSettings> |
| <FilterItemStyle Width="90%" /> |
| <MasterTableView AutoGenerateColumns="False" DataSourceID="dsBills" DataKeyNames="AutoNumber"> |
| <RowIndicatorColumn> |
| <HeaderStyle Width="20px"></HeaderStyle> |
| </RowIndicatorColumn> |
| <ExpandCollapseColumn> |
| <HeaderStyle Width="20px"></HeaderStyle> |
| </ExpandCollapseColumn> |
| <Columns> |
| <telerik:GridTemplateColumn AllowFiltering="false"> |
| <HeaderTemplate> |
| <asp:CheckBox runat="server" ID="CheckBoxHeader" OnCheckedChanged="ToggleSelectedState" |
| AutoPostBack="true" /> |
| </HeaderTemplate> |
| <ItemTemplate> |
| <asp:CheckBox runat="server" ID="CheckBox1" OnCheckedChanged="ToggleRowSelection" |
| AutoPostBack="true" /> |
| </ItemTemplate> |
| </telerik:GridTemplateColumn> |
| <telerik:GridBoundColumn DataField="PhoneNumber" HeaderText="Phone Number" ReadOnly="True" |
| SortExpression="PhoneNumber" UniqueName="PhoneNumber"> |
| </telerik:GridBoundColumn> |
| <telerik:GridTemplateColumn DataField="FullName" HeaderText="Full Name" SortExpression="FullName" |
| UniqueName="FullName"> |
| <ItemTemplate> |
| <asp:LinkButton ID="lnkUserAccount" runat="server" Text='<%# Bind("FullName") %>' |
| OnClick="lnkUserAccount_Click" /></ItemTemplate> |
| </telerik:GridTemplateColumn> |
| <telerik:GridBoundColumn DataField="AccountNumber" HeaderText="Account Number" SortExpression="AccountNumber" |
| UniqueName="AccountNumber" DataType="System.String"> |
| </telerik:GridBoundColumn> |
| <telerik:GridBoundColumn DataField="Email" HeaderText="Email" SortExpression="Email" |
| UniqueName="Email" Display="false"> |
| </telerik:GridBoundColumn> |
| <telerik:GridBoundColumn DataField="AutoNumber" DataType="System.Int64" HeaderText="AutoNumber" |
| ReadOnly="True" SortExpression="AutoNumber" UniqueName="AutoNumber" Display="false"> |
| </telerik:GridBoundColumn> |
| <telerik:GridBoundColumn DataField="UserName" HeaderText="UserName" SortExpression="UserName" |
| UniqueName="UserName" Display="false"> |
| </telerik:GridBoundColumn> |
| <telerik:GridDateTimeColumn DataField="DateFrom" DataType="System.DateTime" HeaderText="Date From" |
| SortExpression="DateFrom" UniqueName="DateFrom" DataFormatString="{0:dd/MM/yyyy}" |
| FilterControlWidth="100px"> |
| <ItemStyle HorizontalAlign="Center" /> |
| <HeaderStyle HorizontalAlign="Center" /> |
| </telerik:GridDateTimeColumn> |
| <telerik:GridDateTimeColumn DataField="DateTo" DataType="System.DateTime" HeaderText="Date To" |
| SortExpression="DateTo" UniqueName="DateTo" DataFormatString="{0:dd/MM/yyyy}" |
| FilterControlWidth="100px"> |
| <ItemStyle HorizontalAlign="Center" /> |
| <HeaderStyle HorizontalAlign="Center" /> |
| </telerik:GridDateTimeColumn> |
| <telerik:GridTemplateColumn AllowFiltering="false"> |
| <ItemTemplate> |
| <asp:LinkButton ID="cmdShowDetails" runat="server" CommandName="ShowDetails" Text="Show Details" /></ItemTemplate> |
| </telerik:GridTemplateColumn> |
| </Columns> |
| <PagerStyle Mode="NextPrevNumericAndAdvanced" /> |
| </MasterTableView> |
| <ClientSettings> |
| <Selecting AllowRowSelect="True" /> |
| </ClientSettings> |
| <FilterMenu EnableTheming="True"> |
| <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> |
| </FilterMenu> |
| <EditItemStyle BackColor="#5174AA" /> |
| </telerik:RadGrid> |