RadWindow opens content only at the first time

[Igor]

I use this code to display different divs in RadWindows:

var wnd = window.radopen(null, "modalWindowWithContent");

wnd.set_contentElement($get(contentElement));

wnd.setSize(wndWidth, wndHeight);

wnd.center();

return wnd;

where contentElement is the names of the divs.

AT the first time all works perfect but at the second (and further) time the RadWindow opens but with a blank content. I see in the Firebug that the content of the second div is loaded in the content of the first loaded div and this content (the first) is unvisible.

How can I fix it?

[msigman]

Hi Igor,

Try setting DestroyOnClose="true" on the RadWindowManager.  This should ensure that you are starting with a fresh window each time.

http://www.telerik.com/help/aspnet-ajax/window-programming-server-side-properties.html

[Igor]

I've read about this property but it doesn't help :( What else can I check?

<tl:RadWindow ID="modalWindowWithContent" DestroyOnClose="true" runat="server" Modal="true" Behaviors="Close" OnClientResizeEnd="RadWindowResized"
                KeepInScreenBounds="true" Skin="Office2007" VisibleStatusbar="false" CssClass="rad-window">
</tl:RadWindow>

[Igor]

I still see the contents of the both divs inside the window. Is there any client-side option to clear all the window at all?

[Marin Bratanov]

Hello Igor,

The CotnentTemplate is a simple div, so there is no built in method of resetting it, because there is no such built-in method in .NET or in JavaScript. There are various ways to clear its content and various expected results, which is why the developer should clear this content, if needed.

Another point of interest is that once a content element is set it will be taken from its original place and put in the RadWindow. The next time you open the RadWindow this content will be there, if it is not removed explicitly or a (partial) postback has disposed the RadWindow.

As for the DestroyOnClose property - it has  no effect for RadWindows whose ContentTemplate is used, because it would remove content from the page which can break the developer's logic (i.e., change the control tree that is post-ed to the server).

Here is a sample I tried that changes the content successfully on my end:

<telerik:RadWindowManager ID="RadWindowManager1" runat="server">
    <Windows>
        <telerik:RadWindow ID="modalWindowWithContent" Modal="true" runat="server">
            <ContentTemplate>
            </ContentTemplate>
        </telerik:RadWindow>
    </Windows>
</telerik:RadWindowManager>
<asp:Button ID="Button1" Text="set new content and show" OnClientClick="setNewContentAndShow(); return false;" runat="server" />
<div id="testDiv0">first</div>
<div id="testDiv1">second</div>
<div id="testDiv2">third</div>
<script type="text/javascript">
    var i = 0;
    function setNewContentAndShow()
    {
        var wndWidth = 400;
        var wndHeight = 200;
        var contentElement = "testDiv" + i;
        i++;
        if (i > 3) return;//no div will be found
        var wnd = window.radopen(null, "modalWindowWithContent");
        wnd.set_contentElement($get(contentElement));
        wnd.setSize(wndWidth, wndHeight);
        wnd.center();
        return wnd;
    }
</script>

If you attempt to set the same div (i.e., remove the increment in my snippet) you will see blank content, because the content is already in the ContentTemplate, so when you set a new element the old must be cleared first. The element that loses content, however, is the one you want to set again, hence the issue.

The easiest way to avoid this would be to check what content you are attempting to set and if it is the last one, then move it out of the RadWindow to prevent it from being lost. Here is a small example based on the snippet above that uses a custom field in the RadWindow object:

var i = 0;
function setNewContentAndShow() {
    var wndWidth = 400;
    var wndHeight = 200;
    var contentElement = "testDiv" + i;
    var wnd = window.radopen(null, "modalWindowWithContent");
    if (wnd.__lastContentElementID && (wnd.__lastContentElementID == contentElement))
        document.forms[0].appendChild($get(contentElement));
    wnd.set_contentElement($get(contentElement));
    wnd.__lastContentElementID = contentElement;
    wnd.setSize(wndWidth, wndHeight);
    wnd.center();
    return wnd;
}

Regards,
Marin Bratanov
Telerik