Using UpdatePanel to refresh dynamic dock contents.

[Sean]

Hi Telerik,

My scenario: (All of these controls are dynamically created/restored) I have a RadSplitter w/ 2 RadPanes and a RadSplitBar. Each RadPane has a RadDockZone. Each RadDockZone has a RadDock on it. Each RadDock has a control on it. 

I capture the pane's OnClientResized event and pass back to the server the new height/width of the panes affected so that I may restore their state properly on the next page reinit.

On page reinit I restore all the Rad controls. On page load I restore the controls located on the RadDocks and then I change the controls height/width to reflect the changes made to the RadPane's height/width. 

I do not see these changes immediately. I have to refresh the entire page before I see the changes made. This seems slightly odd to me as I hadn't had any issues seeing the RadDock's control's resizing when I initially drop them onto the page. 

I tried creating conditionally-updating UpdatePanels for each of the RadDocks, adding the UpdatePanel to the RadDock, and then adding the control to the UpdatePanel. I'm not sure where I would call Update, though. I tried calling update in Page_LoadComplete, but was given an error stating that the control could not be found -- curious, because Page.FindControl was able to track it down.

I tried wrapping all the Rad controls in a static UpdatePanel w/ UpdateMode = Always, but it seems to be conflicting heavily with RadAjaxManager. 

I am at a complete loss. I feel extremely close to having this all working, but at the same time maybe the problem is extremely deep-seated. I can provide any/all code necessary, but perhaps a formal ticket might be in order.

Regardless, if Telerik has any idea why I wouldn't be seeing these changes reflected I would be really interested in knowing. I am not convinced I even need an update panel -- the page reinitalizes whenever I care about seeing the changed graph (OnClientResized is firing and thus causing the page to reinit after). 

Thanks!

[Sean]

Any advice on this?

Just to be clear, I can break down the scenario a little bit more:

This works, but is user-initiated so does not serve my purposes (plus is probably an extremely poor way of doing it):

protected void Button1_Click(object sender, EventArgs e)
{
    UpdateAll();
}

private void UpdateAll()
{
    foreach (var control in Page.Controls)
    {
        UpdatePanel panel = control as UpdatePanel;
        if (panel != null)
        {
            if (panel.UpdateMode == UpdatePanelUpdateMode.Conditional)
            {
                panel.Update();
            }
        }
    }
}

Using this event the user is able to drag a RadSplitBar (which resizes a RadPane) and then they press Button1. This causes all the relevant UpdatePanels on the page to update. So, I see each RadDock's content resize to re-fit the RadPane.

I am unable to successfully use the UpdateAll() function anywhere else and I am completely unsure of what I am doing incorrectly. I have tried:

• Calling UpdateAll() on Page_Init, Page_Load, Page_LoadComplete, Page_Unload
• Initiating a RadAjaxManager_AjaxRequest and calling UpdateAll() there.
• Calling UpdateAll() near the end of the OnClientResized event by using a CallbackReference to be able to call server-side functions.

In all these scenarios the UpdatePanels seem to be unknown to the server. 

[Maria Ilieva]

Hello Sean,

Could you please elaborate a bit more on the required functionality you need to achieve? How exactly you need to have the application behaves? Have you try using RadAjaxManager control instead of UpdatePanel and add the needed settings for updating RadDock in it?

Regards,
Maria Ilieva
the Telerik team

[Sean]

Hi Telerik,

The program behaves as such:

The user starts with a blank pane. The user then drag-and-drops content onto this pane. In an extremely simple scenario they would first drag-and-drop a 'horizontal bar' onto the screen. This would have the effect of creating a RadSplitter with Horizontal orientation, 2x RadPane and a RadSplitBar between these two. Each of the RadPanes will contain a RadDockZone.

The user then has the ability to drag-and-drop RadDocks onto this RadDockZone. When dropped, the RadDock loads a Microsoft Chart Control onto it for its content. This graph is resized to fill the dimensions of the RadPane.

At this point they now have the ability to grab the RadSplitBar and drag it to resize the dimensions of the panes on the page. When they release the RadSplitBar the panes are new sizes as well as the RadDockZone, but the RadDock and its content do not update to reflect this new size. The RadDock will expand to holds its content, so it is only necessary to get have the content resize. 

I am setting the dimensions of the content appropriately, but I do not see the content resize when it is being reloaded. Instead, I have to press a button to update it -- and having the panels update at any point prior doesn't seem to help.

I can try ripping out all the update panels and going through my RadAjaxManager, but I have read in several places that this is not best practice.


EDIT: I went ahead and commented out my UpdatePanel wraps, and then tried to get RadAjaxManager to refresh my controls. Still no go. I know this is written horribly, but just to test (and make sure I wrote it correctly) here is what I did for RadAjaxManager:

protected void Page_Load(object sender, EventArgs e)
{
    RegisterCallBackReference();
    RegenerateDockContents();

    foreach (RadDock dock in RadDockLayout1.RegisteredDocks)
    {
        RadAjaxManager1.AjaxSettings.AddAjaxSetting(dock, dock);

        foreach( Control control in Page.Controls )
        {
            RadPane pane = control as RadPane;

            if( pane != null )
            {
                RadAjaxManager1.AjaxSettings.AddAjaxSetting( pane, dock );
            }
        }
    }
}

I also tried it without adding the panes as an Ajaxified control.

I would argue that the problem is that none of these controls are triggering a postback to be captured and ajaxified, but I also tried:

protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)

{

    foreach (Control control in Page.Controls)

    {

        RadDock dock = control as RadDock;

 

        dock.Height = new Unit(999, UnitType.Pixel);

 

        PowerUsage chart = dock.ContentContainer.Controls[0] as PowerUsage;

 

        chart.Height = new Unit(999, UnitType.Pixel);
      }
}

and I call RadAjaxManager1_AjaxRequest in the OnClientResized function. I set these values but nothing happens visibly even though the RadDock is listed in its AjaxSettings.

[Maria Ilieva]

Hello Sean,

As the provided information is not enough to isolate the root cause of the issue you are facing, please prepare a simple, fully runnable reproduction demo, open a new support ticket and send it to us along with very detailed reproduction steps and explanations and we will debug it locally and we will do our best to help.



Greetings,
Maria Ilieva
the Telerik team