Solution: both scrollbars appear when Grid is in edit mode using user control

[Shukhrat Nekbaev]

Hi,

I'm using 2011.1.413.40, I have a Grid and following editing settings:

<EditFormSettings UserControlName="~/Web/Administative/Companies and users/Companies view/NewCompanyWizard.ascx" EditFormType="WebUserControl" PopUpSettings-Modal="true"></EditFormSettings>

problem was that when Grid was in edit/insert mode and overlay was loaded (GridModal_skinName) I could see both scrollbars in browser, which is IE9 (haven't tested other modes or browsers). The size of overlay was bigger than required.

I ended up with following solution (uses jQuery):
add this to your scripts.js file

function customResizeModalBackground() {
    var d = String.format("modalDivId_{0}", this.get_id());
    var b = $get(d);
    if (b) {
        b.style.width = $(window).width();
        b.style.height = $(window).height();
    }
}

var popUp;
function PopUpShowing(sender, eventArgs) {
    popUp = eventArgs.get_popUp();
    var popUpWidth = popUp.style.width.substr(0, popUp.style.width.indexOf("px"));
    popUp.style.left = (Math.round(($(window).width() - popUpWidth) / 2 + sender.get_element().offsetLeft)).toString() + "px";
    popUp.style.top = $('#' + sender.ClientID).position().top + "px";

    sender.resizeModalBackground = customResizeModalBackground;
}

and tell the Grid to call this function when popup is loaded:

<ClientEvents OnPopUpShowing="PopUpShowing" />

you will get centered popup without scrollbars (checked in IE9, Safari, FF4, Chrome)
what we basically do is override native resizing method with custom one that uses jQuery to provide proper width and height

Enjoy! :)