Saurabh Tiwari
Saurabh Tiwari

Reputation: 5131

ui-grid not displaying complete numbers of row provided to it

I have been using ui-grid for some time now. Recently I encountered a issue with the grid wherein if I pass a slightly large set of data (say 50 rows), the grid do not display them all.

When I debug and look for my $scope.gridOption.data object it seems to contain all the element but still only a few (about 10) are displayed.

When I try sorting by clicking headers, a few more rows appear. (1 or 2 sometimes)

This is not regular and has no pattern. It occurs randomly for different data sets.

I am using ui-grid - v3.2.6 and I have a div for grid-table with a max-height and scroll otherwise. I am having multiple such grids on a page with similar implementation but this issue seems to appear currently on a certain grid.

I could draft a plunker but it would not really help as this issue is random and also I have a basic ui-grid implementation.

I followed this link https://github.com/angular-ui/ui-grid/issues/424, however I could not understand much out of it and I am still stuck.

Seems like this is a known and unfixed bug. But is there any working solution for this ???

Any help is appreciated..

Upvotes: 3

Views: 4188

Answers (3)

Sharath
Sharath

Reputation: 606

Setting the virtualizationThreshold to number of rows in data + 1 will work, but that will have performance issue if there are lot of rows.

I did not change the virtualizationThreshold, instead I set the rowHeight and the minRowsToShow. FYI: the default value for virtualizationThreshold in my case was 20.

Following setting worked for me:

        $scope.gridOptions = {
            rowHeight: 20, // set this as number and NOT string
                           // even though the documentation says so.
                           // If its set as string, the issue of 
                           // all the rows not getting displayed will appear.
            minRowsToShow: 18, // this sets the height of the grid 
            ...

minRowsToShow adjusts the height of the grid. rowHeight was also required. Without setting the rowHeight, I had the issue again. Maybe the virtualization algorithm needs rowHeight and minRowsToShow.

Link to the documentation of ui grid options: http://ui-grid.info/docs/#!/api/ui.grid.class:GridOptions

Upvotes: 0

emanuel.virca
emanuel.virca

Reputation: 598

I have faced the same problem and it happened if the number of rows are greater than 45 in my case .Found that setting the self.gridOptions.virtualizationThreshold = data.length + 1; on gridOptions fixed my issue. VirtualizationThreshold must be greater than or equal to the number of rows.

Credit goes to https://github.com/angular-ui/ui-grid/issues/860

Upvotes: 5

Anon
Anon

Reputation: 106

You can set this $scope.gridOptions.excessRows to how much ever rows you want to show, by default this value is set to 4 in ui-grid.

Upvotes: 6

Related Questions