Resizing Problem and AutoResize option

[JB]

Hi,

I'm testing the new Auto Resize facility and so far, it has not been successful.

function openRadWin(id) {
            radopen("http://www.telerik.com", "radWindowFareRules");
        }

Above is the example test Javascript I used to open my RadWindow.

<telerik:RadWindowManager ID="radWindowManager" runat="server" AutoSize="True"
                Behavior="None" InitialBehavior="None"
                KeepInScreenBounds="True">
            <Windows>
                <telerik:RadWindow
                    id="radWindowFareRules"
                    runat="server"
                    showcontentduringload="false"
                    title="Telerik RadWindow" Behavior="Close" AutoSize="true"
                    KeepInScreenBounds="True" Modal="True" Overlay="True"
                    VisibleStatusbar="False">
                </telerik:RadWindow>
            </Windows>
            </telerik:RadWindowManager>

This is my page content where I have my RadWindows and my RadWindowManager.

When the RadWindow opens up, it does not resize by the content size eventhough I have set AutoSize to be true. I assumed it will do the work and resize itself but it didn't.

So I tried the old method that people said have been useful.

In my default page, I had this code as my javascript code.

<script type="text/javascript">
        function openRadWin(id) {
            radopen("FareRules.aspx?id=" + id, "radWindowFareRules");
        }

        function GetRadWindow() {
            var oWindow = null;
            if (window.radWindow) oWindow = window.radWindow;
            else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;
            return oWindow;
        }

        function resetWindow() {
            window.setTimeout(function() {
                var oWnd = GetRadWindow();
                oWnd.SetWidth(300px);
                oWnd.SetHeight(200px);
            }, 400);
        }
    </script>

And in my FareRules.aspx page, I had this Javascript

<script type="text/javascript">
        function resizeWindow() {
            window.setTimeout(function() {
                var oWnd = GetRadWindow();
                oWnd.SetWidth(document.body.scrollWidth + 20);
                oWnd.SetHeight(document.body.scrollHeight + 70);
            }, 400);
        }

        function GetRadWindow()
        {
            var oWindow = null;
            if (window.radWindow) oWindow = window.radWindow;
            else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;
            return oWindow;
        }
    </script>

And on page's body Onload, I called resizeWindow method which seemed to work fine. On execution, the window seemed to resize based on the contents. However, the problem I had with that is that when I close to RadWindow and open it the 2nd time, the 2nd execution opens with the size of the 1st execution and then resizes. So if 1st execution had contents that was in the size of 800x600, then 2nd execution starts as 800x600 and then resizes to the 2nd execution's content which can be like 640x480. I want all the RadWindows to start with it's default small size and then expand to fit the content. Is it achievable?

Please let me know if I made any mistakes or if you require anymore info regarding this problem. I want to find a solution for this.

[Svetlina Anati]

Hi JB,

I already answred your other thread and for your convenience and for others who might encounter the same problem I pasted my reply below:

Thank you for the provided demo, I was able to observe the problem. This issue is already fixed in our latest build, Q2 2009 Beta, namely 2009.2.616. I tested your demo with this version and it worked fine on my side. You can also see the improved behavior in our online demos which are with the mentioned build - the AutoSize one is available below:

http://demos.telerik.com/aspnet-ajax-beta/window/examples/autosize/defaultcs.aspx

This being said, in order to solve the issue you should upgrade to the mentioned build.

On a side note, I recommend to insert the following CSS in the external page, loaded in RadWindow in order to get a better cross-browser consistensy:

<style type="text/css">
    html, body, form
    {
      height: 100%;
      margin: 0;
      padding: 0;
    }

    </style>

All the best,
Svetlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[alex segal]

I am creating window on the server, load a form into it that contains an image and pass image url in a query string.
The style specifying 100% has also been included. Both my window manager and the new window object created on the server have AutoSize = true.
The window opens with no regard to AutoSize setting, but shurely resizes itself correctly once the Reload button is clicked.
Does this sound like a familiar situation to anyone.
Thank you for  your help!
-Alex

 

----------------------------------- server code --------------------------------
Protected Sub thumbClick(ByVal sender As Object, ByVal e As System.EventArgs)
If TypeOf (sender) Is ImageButton Then
Dim b As ImageButton = sender
Dim newwin As RadWindow = New RadWindow()
newwin.NavigateUrl =
"~/Dialog.aspx?imageUrl=" + b.ImageUrl
newwin.VisibleOnPageLoad = True
newwin.AutoSize = True
RadWindowManager1.Windows.Add(newwin)
End If
End Sub

----------------------------------- window manager -------------------------
<telerik:RadWindowManager ShowContentDuringLoad="true"
AutoSize="true" ID="RadWindowManager1" runat="server" Animation="Fade" VisibleStatusbar="false" VisibleOnPageLoad="true" Skin="Black">
</telerik:RadWindowManager>

----------------------------- dialog form aspx --------------------------------
<head runat="server">
<title>Web Gallery</title>
<style type="text/css">
html, body, form
{
height: 100%;
padding: 0;
margin: 0;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
 <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" />
<asp:Image ID="Image1" Style="display: block;" runat="server" />
</form>
</body>

------------------------------ dialog code-behind --------------------------------
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Request("imageUrl") <> Nothing Then
Image1.ImageUrl = Request("imageUrl")
End If
End Sub

[Svetlina Anati]

Hello alex,
 
I assume that what happnes in your demo is that the autoSize is done before the content page is loaded. This is very possible especially when using images since the image needs some time to load. Thus, when you click on the reload button the autosize is triggered again and since teh content page and the image are already loaded, it resizes correctly.

In order to get the desired result I can suggest to choose one of the following options:

1) Remove AutoSize=true and in the content page's pageLoad or Sys.Application.load event reference teh RadWindow and call its autoSize() method explicitly (if you want to also have animation effect while autosizing, pass an argument true to the method).

2) Remove AutoSize=true and call explicitly teh autosize method in the OnClientPageLoad client event of the RadWindow with some timeout. 

Kind regards,
Svetlina
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Stacy]

I have this:

<telerik:RadWindowManager ClientIDMode="Static" ID="PayrollWindows" Width="800" Height="600"
    VisibleStatusbar="false" Behaviors="Close,Move,Resize,Minimize"
    runat="server"  AutoSize="true" AutoSizeBehaviors=Default
    DestroyOnClose="True">
</telerik:RadWindowManager>

However, when i load a page that "autosize" makes smaller than the 800*600 specified, the window is opened super small. The user has to drag the window to make it big enough to click "add" and add some data. 

The autosize works fine when the window i want to open ends up being bigger than the 800*600 specified, but if it's smaller, the window that opens is super small, nothing can be done without dragging it to be bigger.

[Svetlina Anati]

Hello Stacy,

 What you report is not expected and what I can assume is that the content of the RadWindow is causing the problem. However, your code does not show it and thus the only thing I can suggest is to try whether putting the following style in the main page's head helps:

<style type="text/css">
    html, body, form
    {
      height: 100%;
      margin: 0;
      padding: 0;
    }

    </style>

If this does not help, please share fully runnable source code here and once I examine and debug it, I will do my best to help.

Kind regards,
Svetlina
the Telerik team