postback of page inside window scrolls parent to top

[Cheryl]

Hello

I have a page that is ajaxed using Ajax Manager.  There is a RadWindow on the page which uses navigateurl rather than contenttemplate to show a page within the site (so not an external URL)

That page also has AjaxManager on it.  When an ajaxed field within the window is changed the page does a partial postback correctly (and updates whatever it needs to do on itself) however the scroll position of the parent page scrolls to the top.

How do I stop that from happening?

I note that I am using this to scroll back to the window on window load because on opening the window it would scroll to the top as well

  function fnRadWindowPageLoad() {
                if (modalPopUpScrollPositionObj != null)
                    window.scrollTo(modalPopUpScrollPositionObj.XCoordinate(), modalPopUpScrollPositionObj.YCoordinate());
            }

 

I'm using this to open the window in the code behind, after I've done some processing

Dim sbScript As New System.Text.StringBuilder()

        'This needs the Sys.Application.Load event, as the button performs a full postback, thus disposes the entire user control, as well as the page
        sbScript.Append("function f(){")
        sbScript.Append("var oWnd = $find('" & RadWindowSearchFilter.ClientID & "');")
        sbScript.Append("oWnd.show();")
        sbScript.Append("Sys.Application.remove_load(f);")
        sbScript.Append("}")
        sbScript.Append("Sys.Application.add_load(f);")
        ScriptManager.RegisterStartupScript(Page, Me.GetType(), "key", sbScript.ToString(), True)

[Rumen]

Hi Cheryl,

The behavior you are observing, where the parent page scrolls to the top after an AJAX request inside a RadWindow (using NavigateUrl), is expected due to focus and scroll restoration in browsers, especially when dealing with nested AJAX and modal dialogs.

When the RadWindow loads a page via NavigateUrl (iframe), AJAX requests inside that inner page can cause the browser to shift focus. This may result in the parent page scrolling to the top. Your current workaround with fnRadWindowPageLoad helps restore scroll position when opening the window, but it does not cover AJAX events that happen inside the RadWindow.

Recommended Solution

To prevent the parent page from scrolling to the top after AJAX requests inside the RadWindow, you can capture the parent’s scroll position before the AJAX request and restore it after the request completes. This approach complements your existing workaround.

JavaScript Solution

Add the following script to the page loaded inside the RadWindow:

// Variables to store the parent scroll position
var parentScrollX = 0;
var parentScrollY = 0;

function onRequestStart(sender, args) {
    if (window.parent) {
        parentScrollX = window.parent.pageXOffset || window.parent.document.documentElement.scrollLeft;
        parentScrollY = window.parent.pageYOffset || window.parent.document.documentElement.scrollTop;
    }
}

function onResponseEnd(sender, args) {
    if (window.parent) {
        setTimeout(function() {
            window.parent.scrollTo(parentScrollX, parentScrollY);
        }, 30); // Timeout ensures scroll happens after focus is restored
    }
}

How to integrate:

• In your inner page (the one loaded in the RadWindow), wire these functions to the RadAjaxManager client events:

protected void Page_Load(object sender, EventArgs e)
{
    RadAjaxManager manager = RadAjaxManager.GetCurrent(Page);
    manager.ClientEvents.OnRequestStart = "onRequestStart";
    manager.ClientEvents.OnResponseEnd = "onResponseEnd";
}

This will ensure the parent page’s scroll position is preserved after each partial postback.

For more information and a similar approach regarding scroll position when closing a modal RadWindow, see:

• https://www.telerik.com/products/aspnet-ajax/documentation/knowledge-base/window-persist-scroll-position-when-modal-radwindow-is-closed

Regards,
Rumen
Progress Telerik