RadWindow rendering and destroyonclose

[Robby]

If a radwindow with a contenturl is rendered as an iframe, how is one with a content template rendered?

Also,
What is the actual effect of using the destroy onclose property? If it is not used, how is the form "stored"?

[Marin Bratanov]

Hello Robby,

The only difference in the rendering is that if you load an entire page an iframe with the appropriate src attribute will be rendered inside the RadWindow, while the ContentTemplate renders as a simple div with the controls it hosts direclty inside, much like an ASP:Panel control.

You can observe the difference in the following demo: http://demos.telerik.com/aspnet-ajax/window/examples/contenttemplatevsnavigateurl/defaultcs.aspx.

I am pasting below the way the content cell of the RadWindow renders in both cases, all the other markup that creates the layout of the popup (borders, titlebar, statusbar, etc.) is the sam.

ContentTemplate:

<td class="rwWindowContent" valign="top">
  <div id="ctl00_ContentPlaceHolder1_RadWindow_ContentTemplate_C" style="overflow-x: auto; overflow-y: auto; border-top-color: currentColor; border-left-color: currentColor; border-right-color: currentColor; border-bottom-color: currentColor; border-top-width: 0px; border-left-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-top-style: none; border-left-style: none; border-right-style: none; border-bottom-style: none; width: 284px; height: 237px;">
    <p class="contText">
                Enter a value here and click the button to close the RadWindow and pass the
                value to the main page.
            </p>
    <div class="contButton">
      <input name="ctl00$ContentPlaceHolder1$RadWindow_ContentTemplate$C$Textbox1" type="text" id="ctl00_ContentPlaceHolder1_RadWindow_ContentTemplate_C_Textbox1" class="rfdRoundedCorners rfdDecorated" tabindex="0">
    </div>
    <p class="contText">
                Via a simple JavaScript function:
            </p>
    <div class="contButton">
      <a href="javascript:void(0)" class="rfdSkinnedButton" tabindex="0">
        <input type="submit" name="ctl00$ContentPlaceHolder1$RadWindow_ContentTemplate$C$Button1" value="send value and close" onclick="populateValue(); return false;" id="ctl00_ContentPlaceHolder1_RadWindow_ContentTemplate_C_Button1" class="rfdDecorated" tabindex="-1">
      </a>
    </div>
    <p class="contText">
                Via a simple method in the code-behind:
            </p>
    <div class="contButton">
      <a href="javascript:void(0)" class="rfdSkinnedButton" tabindex="0">
        <input type="submit" name="ctl00$ContentPlaceHolder1$RadWindow_ContentTemplate$C$Button2" value="send value through code-behind" id="ctl00_ContentPlaceHolder1_RadWindow_ContentTemplate_C_Button2" class="rfdDecorated" tabindex="-1">
      </a>
    </div>
  </div>
</td>

External page:

<td class="rwWindowContent rwExternalContent" valign="top">
  <iframe name="RadWindow_NavigateUrl" src="Dialog.aspx" style="width: 100%; height: 100%; border-top-color: currentColor; border-left-color: currentColor; border-right-color: currentColor; border-bottom-color: currentColor; border-top-width: 0px; border-left-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-top-style: none; border-left-style: none; border-right-style: none; border-bottom-style: none;" frameborder="0" tabindex="-1"></iframe>
</td>

These are taken direclty from the rendered output of the browser, so some styles are converted to inline styles and shorthands are expanded.


On the DesotroyOnClose property - it has no effect for a RadWindow that uses its ContentTemplate.

When an external page is loaded closing the popup will remove the markup the control has created from the page (it renders with JavaScript anyway), dispose the object and handlers and try to dispose the iframe (as much as is possible in the browser, as this is a bit of functionality the browser alone can handle).

In case DestroyOnClose is not enabled (its default state) when you close a RadWindow it will merely hide with CSS (display: none for the entire popup) so it can be shown afterwards immediately, without a reload. This allows for some caching of the content.

I hope this answers your questions.

Greetings,
Marin Bratanov
the Telerik team

[Shark75]

Could the documentation please get updated to indicate the DestroyOnClose does not work with ContentTemplates in a similar way to how the ReloadOnShow property mentions it?

Thanks.

[Marin Bratanov]

Hello

and thank you for your feedback. Indeed, it should be noted and I will make sure this is done for our next upload. I have updated your Telerik points as a small token of gratitude for your involvement.


Regards,
Marin Bratanov
Telerik

[Fit2Page]

Hi Marin,

 

I got some viewstate problems because I am adding controls to a RadWizard in a RadWindow with ContentTemplate using AJAX.

Would it be possible to destroy the RadWindow from JS code?

For next use it is then build up again from scratch.

There is no need for keeping the content.

 

Marc

[Marin Bratanov]

Hello Marc,

RadWindow explicitly checks if the ContentTemplate is used. If it is, the DestroyOnClose functionality does nothing because it may otherwise break the developer's code.

If you like, you can review the dispose method in the RadWindow prototype to track what it does and implement similar logic in your app.

As for issues with the viewstate - a likely reason for such a problem is having the said RadWindow in a RadWindowManager. When the ContentTemplate is used, the RadWindow should not be in a manager's collection: http://docs.telerik.com/devtools/aspnet-ajax/controls/window/getting-started/using-radwindow-as-controls-container.

Of course, a rather easy alternative is to move the content to an aspx page and add a few function calls or a close event handler to return data.

Regards,

Marin Bratanov
Telerik by Progress

[Fit2Page]

Hi Marin,

 

How could I do this:

If you like, you can review the dispose method in the RadWindow
prototype to track what it does and implement similar logic in your app.

 

[Marin Bratanov]

You can download the source code from your account and go through the files in the Window folder of the Telerik.Web.UI project. I am attaching a short video that show how to get the source.

--Marin