This is a migrated thread and some comments may be shown as answers.

Strange behaviour when using style for position

3 Answers 20 Views
Window
This is a migrated thread and some comments may be shown as answers.
David Penny
Top achievements
Rank 2
David Penny asked on 14 May 2013, 08:51 AM
Hi,

I have added the following style information to several of my pages where a RadGrid calls an update form using a RadWindow. This was added following recommendations here because the RadWindow would open almost of the page when the grid was scrolled down.

<style type="text/css">
        .RadWindow
        {
            top: 0px !important;
            left: 0px !important;
        }
    </style>

Since upgrading to the 2013 Q1 release (and later) this style entry now makes the Radwindow, when closed, to display as small in the top corner of the calling page as modal and it cannot be closed - the entire web page has to be closed.

If I remove the style then the RadWindow works as expected, but the position can then be wrong in certain browsers.

David Penny

3 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 15 May 2013, 10:28 AM
Hi David,

Could you link me to the resource that advised on using such styles, as it may have been a recommendation for a very peculiar scenario? Generally, such rules should not be used as they can interfere with the overall positioning logic of the control.

If you are having issues with the popup position it is better if they are addressed at their source instead of patched with CSS overrides. What I can suggest in this regard is the following, condensed from common issues people have had
- if you are using anchors to open the popups make sure their href attribute is set to javascript:void(0); and not to a # sign so that they do not scroll the page. Cancelling the default browser action by returning false can also work to prevent the scrolling they will do
- try using the OnClientShow event of the control to call its center() method, e.g. function OnClientShowHandler(s) { s.center(); }
- make sure there aren't any controls that receive focus on the server, as they can also scroll the page, both in the RadWindow or on the calling page


Greetings,
Marin Bratanov
the Telerik team
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 their blog feed now.
0
David Penny
Top achievements
Rank 2
answered on 15 May 2013, 11:10 AM
Hi Marin,

The CSS originally came from this thread:

http://www.telerik.com/community/forums/aspnet-ajax/scheduler/radwindow-opened-from-scheduler-not-correctly-positioned.aspx

As I said, I have had to remove the CSS as it was causing other problems since 2013 Q1. But the original problem has then started happening again where the Browse window is scrolled down below the first page entries and a window is opened.

David
0
Marin Bratanov
Telerik team
answered on 17 May 2013, 10:15 AM
Hi David,

I tried to reproduce this problem and I was not able to. I am attaching the page I tested with, if you can modify it to mimic your scenario and show the problem I will do my best to help  resolve the case. I used this demo as base.

In the meantime I can suggest a few things you can try:
1) add a timeout when you open the RadWindow and when you maximize it
var ow = window.radopen("EditEvent.aspx?Mode=Insert&Start=" + start + "&IsAllDay=" + isAllDay, "AdvancedForm");
setTimeout(function ()
{
    ow.maximize();
}, 0);

you can also try increasing this timeout to see if this will help


2) see if there is a server request despite of the eventArgs.set_cancel(true); call, some of the other methods that are called can be causing this. In that case it is possible that the page scrolls to the top because of the postback. What you can do in this case is to use the pageRequestManager endRequest event to catch this moment, get a referecnce to that window and restrore, then maximize, e.g.:
function endRequestHandler()
{
    var wnd = GetRadWindowManager().getWindowByName("AdvancedForm");
    if(wnd && wnd.isMaximized()){
        wnd.restore();
        setTimeout(function ()
        {
            wnd.maximize();
        }, 0);
    }
}
Sys.WebForms.PageRequestManager.getInstance().remove_endRequest(endRequestHandler);
where the timeout may not be necessary or may need to be increased.


3) look for code that sets focus somewhere on the page - either with JavaScript, or with the server Focus() method. This can also cause the browser to scroll to the top. If there is such code it should be removed, a modal popup conflicts with the concept of the page behind having focus.

Regards,
Marin Bratanov
the Telerik team
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 their blog feed now.
Tags
Window
Asked by
David Penny
Top achievements
Rank 2
Answers by
Marin Bratanov
Telerik team
David Penny
Top achievements
Rank 2
Share this question
or