RadOpen RenderMode and Skins

4 posts, 0 answers
  1. Rudy
    Rudy avatar
    2 posts
    Member since:
    Apr 2015

    Posted 09 Apr 2015 Link to this post

    Please Help, How if using RadOpen in javascript to change the Render Mode and Skin?
  2. Marin Bratanov
    Marin Bratanov avatar
    3562 posts

    Posted 10 Apr 2015 Link to this post

    Hello Rudy,

    This is impossible.

    To have RadWindows with different skins, you must have these skins registered on the page and this happens when a control has its Skin attribute set accordingly in the markup. You can have several RadWindows defined with different skins, but ones generated on the fly via RadWindowManager will have its skin.

    As for the render mode - only one is supported on any given page: http://www.telerik.com/help/aspnet-ajax/window-render-modes.html. Thus, all RadWindows and RadWindowManagers must have the same value set.

    Here is an example of having different skins, with comments that show what will happen with each API call:

    <form id="form1" runat="server">
        <asp:ScriptManager ID="Scriptmanager1" runat="server" />
        <telerik:RadWindowManager ID="RadWindowManager1" runat="server" Skin="Windows7">
                <telerik:RadWindow ID="RadWindow1" runat="server" Skin="Black" Title="Black skin"></telerik:RadWindow>
                <telerik:RadWindow ID="RadWindow2" runat="server" Skin="Metro" Title="Metro"></telerik:RadWindow>
                <telerik:RadWindow ID="RadWindow3" runat="server" Title="Windows7"></telerik:RadWindow>
            function pageLoad() {
                radopen(null, "RadWindow1");//will open RadWindow1 with Black skin
                radopen(null, "RadWindow2");//will open RadWindow2 with Metro skin
                radopen(null, "RadWindow3");//will open RadWindow3 with Windows7 skin
                radopen(null, "someDynamicRadWindow");//will open a dynamic RadWindow with Windows7 skin


    Marin Bratanov

    See What's Next in App Development. Register for TelerikNEXT.

  3. DevCraft R3 2016 release webinar banner
  4. Rudy
    Rudy avatar
    2 posts
    Member since:
    Apr 2015

    Posted 11 Apr 2015 in reply to Marin Bratanov Link to this post

    Thanks marin, but I have tried successfully to skin but rendermode still does not work, I use radwindow within radwindow, this is my source:


        <add key="Telerik.Skin" value="Vista"/>
        <add key="Telerik.Window.Skin" value="WebBlue" />
        <add key="Telerik.Web.UI.Window.RenderMode" value="lightweight" />
        <add key="Telerik.EnableEmbeddedSkins" value="true" />
        <add key="Telerik.EnableEmbeddedBaseStylesheet" value="true"/>
        <add key="Telerik.ScriptManager.TelerikCdn" value="Disabled"/>
        <add key="Telerik.StyleSheetManager.TelerikCdn" value="Disabled"/>

            <form id="popup" runat="server" style="background-color:silver;width:674px; height: 632px;">
                  <asp:Button runat="server" id="case_solution" Text="Add Case/Solution"  OnClick="case_solution_Click" Font-Names="Arial" Font-Size="8pt" />

            <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        <script type="text/javascript">
            function GetRadWindow() {
                var oWindow = null;
                if (window.radWindow)
                    oWindow = window.radWindow; else if (window.frameElement.radWindow)
                        oWindow = window.frameElement.radWindow; return oWindow;

            function radwindowpop(url) {
               var oBrowserWnd = GetRadWindow().BrowserWindow;
                var parentRadWindowManager = oBrowserWnd.GetRadWindowManager();
                parentRadWindowManager.setSize(534, 410);
                parentRadWindowManager.set_behaviors(Telerik.Web.UI.WindowBehaviors.Move + Telerik.Web.UI.WindowBehaviors.Close);
                parentRadWindowManager.set_title("<b>CASE and Solution</b>");
                var newWin = parentRadWindowManager.open(url, "RadWindow1");
                newWin.firstDialogReference = GetRadWindow();
            //Put your JavaScript code here.
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <telerik:RadWindowManager ID="RadWindowManager1" runat="server" EnableEmbeddedSkins="true" Skin="Vista" Height="63px">
                <telerik:RadWindow ID="RadWindow1" runat="server" Skin="Metro" RenderMode="Lightweight" Title="Black skin"></telerik:RadWindow>


                     ClientScript.RegisterStartupScript(this.GetType(), "openpopup2", "radwindowpop('www.google.com');", true);






  5. Danail Vasilev
    Danail Vasilev avatar
    1476 posts

    Posted 16 Apr 2015 Link to this post

    Hello Rudy,

    I am not able to reproduce the mentioned issue. After modifying a little bit the JavaScript that opens the window it renders like this - http://screencast.com/t/RsczmrDXn0

    I can suggest that you try the following steps:
       - Can you ensure that all of the controls on the page have the same rendering?
       - If you are not using latest Telerik UI - 2015.1.401, does upgrading to it helps?
       - Does removing all of the styles on the page help? If that is so you can start turning them piece by piece until you find the problematic rule. More information is available here - http://www.telerik.com/help/aspnet-ajax/window-troubleshooting-distorted-appearance.html

    I have also attached the test page. If the above steps do not help can you please reproduce the issue with the attached sample and then tell us what changes you have made, so that I can proceed further with the investigation?

    Danail Vasilev

    See What's Next in App Development. Register for TelerikNEXT.

Back to Top