[3.0] ui-grid 'ui.grid.selection' messing up grid display

[juliekirwin]

I'm trying out the ui.grid.selection on my grid and it's behaving oddly(see picture below). My code is very bare bones at this point so not sure what would be breaking it if it's on me. I followed the tutorial http://ui-grid.info/docs/#/tutorial/210_selection

Controller:

$scope.shiftGrid = {
        enableSorting: true,
        enableFiltering: true,
        enableCellEditOnFocus: true,
        enableRowSelection: true,
        columnDefs: [
          { field: 'ShiftID', displayName: 'Shift ID', type: 'number', width: '20%', enableCellEdit: true },
          { field: 'ShiftDesc', displayName: 'Description', type: 'string', width: '50%', enableCellEdit: true },
          { field: 'Capacity', displayName: 'Capacity', type: 'number', width: '30%', enableCellEdit: true },
        ]
    };

    $scope.shiftGrid.multiSelect = true;

HTML:

<div ui-grid="shiftGrid" ui-grid-selection ui-grid-edit ui-grid-cellnav class="myGrid"></div>

Here's the picture:

[c0bra]

This is a duplicate of #1559. Can you tell me what browser (with version) and OS you're seeing this in?

[juliekirwin]

Browser: Chrome Version 37.0.2062.124 m
OS: Windows 8.1

[PaulL1]

@juliekirwin : if you have the opportunity, could you tell me the grid width in Chrome? For me, the problem I had was that the grid width was 877.5, but the Chrome offsetWidth reported it as 878, and that rounding up by half a pixel was pushing everything out. Wondering if it's the same for you.

If you're in the debugger, you can see this with a breakpoint in the getWidthOrHeight method of gridUtil, or you can simulate it by adding a width to the body render container element, and making it a half pixel smaller than whatever Chrome currently thinks it is.

[PaulL1]

Believed to be fixed via #1605

[abhishekam]

I am still facing the exact same issue, although I seem to have the bits that were checked in with #1605. I do not think #1605 fixed it... I am seeing the same issue in both chrome and firefox dev edition.

[RedDroid]

This issue still exists in chrome. it works fine in other browsers but it still seems to appear in chrome.

[jfuehner]

I see this as well in FireFox. Any update or workaround? I'm using v3.0.0-RC.18-270d031. Also, when I view the selection tutorial on the ui-grid.info site it's jacked up too...

[naijenn]

I'm using v3.0.0-RC.20 and having this issue on Mac OS 10.8.5 and 10.10 using FF, Chrome, and Safari

It the best case its glitchy.

[plessbd]

I am also having this issue, I have found that it seems to be fine if you specify the data at the creation of the grid, but when you load the data through an ajax call after the controller loads it causes the grid to not display properly until a window resize.