Dock inside an UpdatePanel not being refreshed

9 posts, 0 answers
  1. Lina
    Lina avatar
    30 posts
    Member since:
    Jan 2008

    Posted 05 Mar 2008 Link to this post

    Hi,

    I'm working on the PortalSiteCS example provided by Telerik. 

    I have updated one of the widgets to contain a label, a textbox and a button.  This is what I want: when the user types something into the textbox and clicks the button the label should be updated with the new value and in the database the value of Configuration should be updated with the new value.

    For this to happen I trigger a postback when the user clicks the button inside the dock.  The button bubbles up an event to the parent - default page.  The default page gets the ID of the dock and the value of the label.  I enclosed DockLayout in and UpdatePanel and here I call update() on it hoping to trigger postback but that doesn't happen!  The new value is saved to the database so a second click on the button inside the dock does refresh the value of the label. 

    Any clues as to why this is happening? I've attached code below:

    Thanks.

    Default.aspx
    <asp:scriptmanager runat="server" id="ScriptManager1">  
    </asp:scriptmanager> 
    Widget Configuration:  
    <asp:textbox maxlength="20" runat="server" id="TextConfiguration"></asp:textbox> 
    <asp:dropdownlist runat="server" id="ListWidgets">  
    </asp:dropdownlist> 
    <asp:button runat="server" id="ButtonAddDock" text="Add Dock" onclick="ButtonAddDock_Click" /> 
     
     
     
    <asp:UpdatePanel ID="ParentUpdatePanel" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional" > 
        <ContentTemplate> 
            <telerik:raddocklayout id="DockLayout" runat="server" onloaddocklayout="DockLayout_LoadDockLayout" 
                onsavedocklayout="DockLayout_SaveDockLayout" storelayoutinviewstate="false">  
                <div> 
                    <telerik:raddockzone runat="server" id="ZoneLeft" style="float: left; margin-right: 10px;" 
                        width="45%" minheight="200px">  
                    </telerik:raddockzone> 
                    <telerik:raddockzone runat="server" id="ZoneRight" style="float: left;" minheight="200px" 
                        width="45%">  
                    </telerik:raddockzone> 
                </div> 
                <div style="display: none">  
                    <asp:updatepanel runat="server" id="UpdatePanel1">  
                        <triggers> 
                            <asp:asyncpostbacktrigger controlid="ButtonAddDock" eventname="Click" /> 
                        </triggers> 
                    </asp:updatepanel> 
                </div> 
            </telerik:raddocklayout> 
       </ContentTemplate>                    
    </asp:UpdatePanel> 
     

    Default.aspx.cs
    public partial class _Default : System.Web.UI.Page  
    {  
        int PageID = 1;  
        List<PageWidgetInfo> _pageWidgets;  
     
        protected List<PageWidgetInfo> PageWidgets  
        {  
            get  
            {  
                if (_pageWidgets == null)  
                {  
                    _pageWidgets = PageWidgetInfo.SelectPageWidgets(PageID);  
                    _pageWidgets.Sort();  
                }  
                return _pageWidgets;  
            }  
        }  
     
        protected override void OnInit(EventArgs e)  
        {  
            foreach (PageWidgetInfo pageWidget in PageWidgets)  
            {  
                RadDock dock = CreateDock(pageWidget);  
     
                DockLayout.Controls.Add(dock);  
     
                CreateSaveStateTriggers(dock);  
            }  
            base.OnInit(e);  
        }  
     
        protected override void OnLoad(EventArgs e)  
        {  
            ScriptManager1.RegisterAsyncPostBackControl(TriggerAsyncPostback);  
     
            if (!IsPostBack)  
            {  
                ListWidgets.DataSource = WidgetInfo.Select();  
                ListWidgets.DataTextField = "Name";  
                ListWidgets.DataValueField = "ID";  
                ListWidgets.DataBind();  
            }  
     
            base.OnLoad(e);  
        }  
     
        protected RadDock CreateDock(PageWidgetInfo pageWidgetInfo)  
        {  
            RadDock dock = new RadDock();  
            dock.ApplyState(DockState.Deserialize(pageWidgetInfo.State));  
            dock.ID = pageWidgetInfo.ID.ToString();  
            dock.Tag = pageWidgetInfo.ID.ToString();  
     
            BaseWidget widget = LoadControl(pageWidgetInfo.Path) as BaseWidget;  
            if (widget == null)  
            {  
                throw new Exception(string.Format("The UserControl with path '{0}' does not inherit from BaseWidget. All widgets must inherit from BaseWidget.", pageWidgetInfo.Path));  
            }  
            widget.Configuration = pageWidgetInfo.Configuration;  
            dock.ContentContainer.Controls.Add(widget);  
              
     
            //Currently, there is a problem with the RadDock command items:  
            // if they are not explicitly created, the Command event it not fired.  
            dock.Commands.Add(new DockCloseCommand());  
            dock.Commands.Add(new DockExpandCollapseCommand());  
            dock.Command += new DockCommandEventHandler(Dock_Command);  
     
            return dock;  
        }  
     
        protected RadDock CreateDock(int widgetID, string widgetConfiguration)  
        {  
            WidgetInfo widget = WidgetInfo.Select(widgetID);  
            if (widget == null)  
            {  
                throw new Exception(string.Format("Cannot find a Widget with ID={0}.", widgetID));  
            }  
            PageWidgetInfo newPageWidget = PageWidgetInfo.Insert(PageID, widgetID, widgetConfiguration, string.Empty);  
            PageWidgets.Add(newPageWidget);  
     
            RadDock dock = CreateDock(newPageWidget);  
            dock.Title = widget.Name;  
     
            return dock;  
        }  
     
        protected void Dock_Command(object sender, DockCommandEventArgs e)  
        {  
            if (e.Command.Name == "Close")  
            {  
                ScriptManager.RegisterStartupScript(  
                    UpdatePanel1,  
                    this.GetType(),  
                    "RemoveDock",  
                    string.Format("function _removeDock() {{" +  
                        "Sys.Application.remove_load(_removeDock);" +  
                        "$find('{0}').undock();" +  
                        "$get('{1}').appendChild($get('{0}'));" +  
                        "$find('{0}').doPostBack('DockPositionChanged');" +  
                        "}};" +  
                        "Sys.Application.add_load(_removeDock);", ((RadDock)sender).ClientID, UpdatePanel1.ClientID),  
                    true);  
            }  
        }  
     
        private PageWidgetInfo FindWidget(int id)  
        {  
            foreach (PageWidgetInfo info in PageWidgets)  
            {  
                if (info.ID == id) return info;  
            }  
            return null;  
        }  
     
        protected void DockLayout_SaveDockLayout(object sender, DockLayoutEventArgs e)  
        {  
            foreach (DockState state in DockLayout.GetRegisteredDocksState())  
            {  
                int stateWidgetID = int.Parse(state.Tag);  
     
                PageWidgetInfo pageWidget = FindWidget(stateWidgetID);  
                if (pageWidget != null && !state.Closed)  
                {  
                    pageWidget.State = state.ToString();   
                    pageWidget.Update();  
                }  
                else  
                {  
                    PageWidgetInfo.Delete(stateWidgetID);  
                }  
            }  
        }  
     
        private void CreateSaveStateTriggers(RadDock dock)  
        {  
            dock.AutoPostBack = true;  
            dock.CommandsAutoPostBack = true;  
     
            AsyncPostBackTrigger saveStateTrigger = new AsyncPostBackTrigger();  
            saveStateTrigger.ControlID = dock.ID;  
            saveStateTrigger.EventName = "DockPositionChanged";  
            UpdatePanel1.Triggers.Add(saveStateTrigger);  
     
            saveStateTrigger = new AsyncPostBackTrigger();  
            saveStateTrigger.ControlID = dock.ID;  
            saveStateTrigger.EventName = "Command";  
            UpdatePanel1.Triggers.Add(saveStateTrigger);  
        
        }  
     
        protected void ButtonAddDock_Click(object sender, EventArgs e)  
        {  
            RadDock dock = CreateDock(int.Parse(ListWidgets.SelectedValue), TextConfiguration.Text);  
     
            UpdatePanel1.ContentTemplateContainer.Controls.Add(dock);  
     
            CreateSaveStateTriggers(dock);  
     
            ScriptManager.RegisterStartupScript(  
                dock,  
                this.GetType(),  
                "AddDock",  
                string.Format(@"function _addDock() {{" +  
                    "Sys.Application.remove_load(_addDock);" +  
                    "$find('{1}').dock($find('{0}'));" +  
                    "$find('{0}').doPostBack('DockPositionChanged');" +  
                    "}};" +  
                    "Sys.Application.add_load(_addDock);", dock.ClientID, ZoneLeft.ClientID),  
                true);  
        }  
     
        protected void DockLayout_LoadDockLayout(object sender, DockLayoutEventArgs e)  
        {  
            foreach (PageWidgetInfo pageWidget in PageWidgets)  
            {  
                e.Indices[pageWidget.DockState.UniqueName] = pageWidget.DockState.Index;  
                e.Positions[pageWidget.DockState.UniqueName] = pageWidget.DockState.DockZoneID;  
            }  
        }  
     
        protected override bool OnBubbleEvent(object source, EventArgs e)  
        {  
            Type type = source.GetType();  
            string souceName = type.ToString();  
     
            if ((e is CommandEventArgs) && souceName.Equals("System.Web.UI.WebControls.Button"))  
            {  
                Button temp = (Button)source;  
                if(temp.ID.Equals("Button1"))  
                {  
                    TriggerAsyncPostback_Click(source, e);  
                }  
     
                return true;  
            }  
            return false;  
        }    
     
        protected void TriggerAsyncPostback_Click(object sender, EventArgs e)  
        {  
            CommandEventArgs args = (CommandEventArgs)e;  
            string configuration = (string)args.CommandArgument;  
            string ID = (string)args.CommandName;  
     
            //recreate it with the new data  
            PageWidgetInfo pageWidgetInfo = FindWidget(int.Parse(ID));  
            pageWidgetInfo.Configuration = configuration;  
     
            //delete all docks from the zones  
            foreach (RadDockZone zone in DockLayout.RegisteredZones)  
            {  
                zone.Controls.Clear();  
            }  
     
            //update DockLayout by updating the panel         
            ParentUpdatePanel.Update();  
        }  



  2. Petio Petkov
    Admin
    Petio Petkov avatar
    825 posts

    Posted 10 Mar 2008 Link to this post

    Hi Lina,

    Your code looks fine and I cannot tell at this point what might be the reason for the problem. Can you please send us a simple running project, where we can observe the problem?

    Once we receive it, we will do our best to help you.


    Sincerely yours,
    Petio Petkov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. Lina
    Lina avatar
    30 posts
    Member since:
    Jan 2008

    Posted 10 Mar 2008 Link to this post

    Hi Petio,

    Thank for looking into it.  I will mail you some code. 

    Meanwhile I am facing another issue.  I'm trying to implement an out-of-panel update using a RadAjaxPanel.  I added the following code in the ascx:

    <input type="button" value="Apply" onclick='<%=RadAjaxPanel1.ClientID%>.AjaxRequestWithTarget("<%=RadAjaxPanel1.UniqueID %>", "ChangeColor")' /> 
     and  overrode RaisePostBackEvent in the ascx.cs but I get the following errors (I tried implementing IPostBackEventHandler) :

     protected override void RaisePostBackEvent(IPostBackEventHandler source, String eventArgument)  
        {  
            base.RaisePostBackEvent(source, eventArgument);  
            switch (eventArgument)  
            {  
                case "ChangeColor":  
                    RadAjaxPanel1.BackColor = Color.Maroon;  
                    break;  
            }  
        }   

    Error 1 'UserControls_Tile.RaisePostBackEvent(System.Web.UI.IPostBackEventHandler, string)': no suitable method found to override 

    Error 2 'UserControls_Tile' does not implement interface member 'System.Web.UI.IPostBackEventHandler.RaisePostBackEvent(string)'


    Can you send a small code sample where out-of-panel update is used?

    Thanks,
    Lina


  4. Lina
    Lina avatar
    30 posts
    Member since:
    Jan 2008

    Posted 11 Mar 2008 Link to this post

    Hi,

    Before you ask, I am not using a RadAjaxManager instead as I am trying to ajaxify webcontrols inside a usercontrol inside a dynamically created dock. 

    Waiting for the a quick code sample of out-of-panel update of RadAjaxPanel which I think would be an easier implementation in my scenario.

    Thanks,
    Lina
  5. Lina
    Lina avatar
    30 posts
    Member since:
    Jan 2008

    Posted 13 Mar 2008 Link to this post

    Hi,

    Can someone help with this query?

    Thanks,
    Lina
  6. Obi-Wan Kenobi
    Obi-Wan Kenobi  avatar
    460 posts
    Member since:
    Aug 2007

    Posted 14 Mar 2008 Link to this post

    You can read about your errors here:
    http://www.telerik.com/community/forums/thread/b311D-mmgmc.aspx



    Generally UserControl does not implement IPostBackEventHandler. That is why, to achieve your goal you need to implement the following interface when needed. Here is the bare bone logic:

    Public Class WebUserControl1 
        Inherits System.Web.UI.UserControl 
        Implements IPostBackEventHandler 
     
        Public Sub RaisePostBackEvent(ByVal eventArgument As StringImplements System.Web.UI.IPostBackEventHandler.RaisePostBackEvent 
     
        End Sub 
    End Class 
    RaisePostBackEvent should have a single string argument"

  7. Lina
    Lina avatar
    30 posts
    Member since:
    Jan 2008

    Posted 14 Mar 2008 Link to this post

    Thanks for the reply.  I tried implementing the code - everything compiles now but I get the following runtime error:

    The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

    So I put code for the button inside a RadScriptBlock.  When the button is clicked I see that the code inside onclick of the button is reached but the RaisePostBackEvent is not being fired. 

    ascx:

    <telerik:RadScriptBlock runat="server" ID="RadScriptBlock1">     
       <input type="button" value="Simple Button" onclick='<%=RadAjaxPanel1.ClientID%>.AjaxRequestWithTarget("<%=RadAjaxPanel1.UniqueID %>", "ChangeColor")' /> 
    </telerik:RadScriptBlock >    


    ascx.cs:
     
    public partial class UserControls_Tile : System.Web.UI.UserControl, IPostBackEventHandler   
    {  
    .  
    .  
    .  
    void IPostBackEventHandler.RaisePostBackEvent(String eventArgument)   
        {  
            switch (eventArgument)  
            {  
                case "ChangeColor":  
                    RadAjaxPanel1.BackColor = System.Drawing.Color.AntiqueWhite;  
                    break;  
            }     
        }  
     
  8. Petio Petkov
    Admin
    Petio Petkov avatar
    825 posts

    Posted 18 Mar 2008 Link to this post

    Hi Lina,

    Please open a new support ticket and send us a project, where we can observe the problems you have. Once we receive it we will do our best to help you.Please provide us a detailded description about your desired goal too.

    All the best,
    Petio Petkov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  9. Lina
    Lina avatar
    30 posts
    Member since:
    Jan 2008

    Posted 19 Mar 2008 Link to this post

    Hi Petio,

    I submitted this ticket: 127671

    Thanks
Back to Top