Properties applied after window is visible

5 posts, 0 answers
  1. xr280xr
    xr280xr avatar
    13 posts
    Member since:
    Aug 2013

    Posted 29 Oct 2013 Link to this post

    I'm just getting started with the Window control. I've placed a RadWindowManager on my form and created a window inside of it:

    <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
            <Windows>
                <telerik:RadWindow ID="CVC" runat="server" Animation="Slide"
                    Behavior="Resize, Close, Move, Reload" Behaviors="Resize, Close, Move, Reload"
                    EnableShadow="True" Height="450px" NavigateUrl="/what_is_cvc.html"
                    style="display:none;" Title="Security Code" Width="340px"
                    KeepInScreenBounds="True" OffsetElementID="aCvc" VisibleStatusbar="False"
                    VisibleTitlebar="True" ShowContentDuringLoad="True" Skin="Windows7">
                </telerik:RadWindow>
            </Windows>
        </telerik:RadWindowManager>

    I'm opening the window when a link is clicked:
    <a id="aCvc" href="#" onclick='radopen(null, "CVC");' >What is this? </a>

    When I run it, it works, but the shadow is applied after the Window is shown. When I had a Top and Left offset defined, these were also applied after the Window was shown causing it to jump to a new position. How can I get the properties to apply before the Window is visible?
  2. Ianko
    Admin
    Ianko avatar
    1535 posts

    Posted 01 Nov 2013 Link to this post

    Hi Jesse,

    If the case is that you want to position the window accordingly to a desired element, like you have configured with the OffsetElementID="aCvc", and this element is not hidden, then you can resolve the described issue by setting the property KeepInScreenBounds="False" or with its removal.

    If you want to position the window in the center of the browser's window, thin you can safely remove both OffsetElementID and KeepInScreenBounds properties.

    Regards,
    Ianko
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. xr280xr
    xr280xr avatar
    13 posts
    Member since:
    Aug 2013

    Posted 07 Nov 2013 Link to this post

    Thanks Ianko, but the problem is not the final position of the window, but the fact that it's appearing one way and then visibly changing according to the properties. I do want it relative to the offset element and I guess it's ok if it scrolls outside of the view port so I've set KeepInScreenBounds to false. But that doesn't solve the problems which are:

    • If I set the Top or Left properties to change the offset amount, the window first appears in its default position, and then moves to the correct position. So the user sees the window jump from one spot to another.
    • The window appears without a shadow and then the shadow is applied (causing the window to slightly shrink to accommodate the shadow). When I click the button to close the window, the reverse happens; the shadow disappears and the window gets slightly larger and then the window disappears.

    I would like the window to determine its final size and position before being displayed so that it's not changing and moving around when the user sees it.


  5. xr280xr
    xr280xr avatar
    13 posts
    Member since:
    Aug 2013

    Posted 07 Nov 2013 Link to this post

    Here is an example using Top="45px" Left="45px":

    http://youtu.be/fOhkiZQ4jos
  6. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3595 posts

    Posted 08 Nov 2013 Link to this post

    Hi Jesse,

    All of this happens because animations change the lifecycle of the control. The problem with positioning is explained here: http://www.telerik.com/support/kb/aspnet-ajax/window/how-to-use-an-offsetelement-with-animations.aspx. The article also offers a workaround that can easily be extended via the client-side API of the control (get_offsetElementID(), get_left(), get_top()): http://www.telerik.com/help/aspnet-ajax/window-programming-radwindow-methods.html.

    Perhaps the simplest way to resolve all of this is to remove animations:
    <telerik:RadWindow ID="CVC" runat="server" Animation="None" . . .
    </telerik:RadWindow>



    Regards,
    Marin Bratanov
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017