Intersoft Community - WebGrid Enterprise - WebGrid edit box misplaced when browser's window is scrolled

WebGrid edit box misplaced when browser's window is scrolled

yudi — Mon, 02 Nov 2015 02:13:39 GMT

Glad to hear that the snippet code helps to resolve the problem - WebGrid edit box misplaced when browser's window is scrolled.

Should you need further assistance or run into any problems regarding our controls, feel free to post it into our forum. We would be happy to assist you again.

WebGrid edit box misplaced when browser's window is scrolled

dbar@diasfalisis.gr — Fri, 30 Oct 2015 14:31:39 GMT

I've added the code you proposed and it works great now.

Many thanks!

WebGrid edit box misplaced when browser's window is scrolled

yudi — Thu, 22 Oct 2015 04:14:10 GMT

I created a simple page of WebGrid based on your description and managed to reproduce the reported problem in my local test.

Adding the following JS code fix the edit box misplaced problem in my local end. Thanks to Leo Chandra for providing the script.

function EnterEditMode(controlId, tblName, editObject)
{
    if (IS.chrome || IS.moz)
    {
        var grid = ISGetObject(controlId)
        var element = editObject.element;

        if (editObject.element.GetFrameElement)
            element = editObject.element.GetFrameElement();

        var offsetLeft = ISPosLib.getLeftNonIE(grid.FrameObj) - ISPosLib.getLeft(grid.FrameObj);
        element.style.left = (parseInt(element.style.left) + (offsetLeft)) + "px";
    }
}

Try to assign the above script to WebGrid's OnEnterEditMode client-side event. Please feel free to let me know if you have different result.

WebGrid edit box misplaced when browser's window is scrolled

dbar@diasfalisis.gr — Wed, 21 Oct 2015 14:05:04 GMT

In a certain page type of our project, WebGrid is contained within a div which is absolutely positioned on the page. There may be more that one DIVs like this and the whole look resembles to a MDI windows application.

Depending on the size and position of each DIV, the actual page size might exceed the physical size of the browser window. In this case, scrollbars appear on the browser window and the user can use them to scroll around the page.

In the latter case, if a record is edited, the corresponding textbox on the grid is misplaced. The offset is equal to the amount of window scrolling.

On IE11 it works fine
On Chrome the edit box is moved to the left (see attached document for a screenshot)
On Firefox the edit box is moved to the right (see attached document for a screenshot)

If the window is not scrolled, the edit box is displayed in place.

Any ideas?

Thanks,

Dimitris