How to select the first row by default in UI-grid in angular JS

Question

How select the first Row default in UI-Grid in Angular JS:

I tried below code, but it is not working:

 $scope.gridOptions.data =  someData;
    $timeout(function () {
        $scope.gridApi.selection.selectRow($scope.gridOptions.data[0]);
    },
    100)

and Tried even below solution also but this is also not working :

 $scope.gridOptions.data =  someData;
    $scope.gridApi.selection.selectRow($scope.gridOptions.data[0]);

Could any one please suggest how to get it. Thanks in advance

Hi @VinoDang, I am using 3.1.0 UI-Grid and angular js version is 1.5.0-rc.1 — Coder
– Coder, Commented Feb 1, 2016 at 14:16

Community · Accepted Answer · 2017-05-23 11:45:01Z

1

the following code requires ui-grid v3.0.0-rc.22, you can call modifyRows as follows:

$scope.gridOptions.data =  someData;
$scope.gridApi.grid.modifyRows($scope.gridOptions.data);
$scope.gridApi.selection.selectRow($scope.gridOptions.data[0]);

No $timeout needed.

you can visit this page:https://github.com/angular-ui/ui-grid/issues/2267 or Angular ngGrid select row on page load

if the above code doesn't work, you can try the following code:

$scope.gridOptions = { 
    ... 
    onRegisterApi : function (gridApi) { 
    $scope.gridApi = gridApi;   
    $scope.gridApi.grid.modifyRows($scope.gridOptions.data); 
    $scope.gridApi.selection.selectRow($scope.gridOptions.data[0]);
     }
};

edited May 23, 2017 at 11:45

CommunityBot

11 silver badge

answered Feb 1, 2016 at 10:53

Python Basketball

2,3803 gold badges27 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Coder Over a year ago

I tried this solution but it is not working, could you suggest any other solution, Thanks for advance !

Python Basketball Over a year ago

could u have a plunker? if you have one, it would be helpful to resolve it!

Python Basketball Over a year ago

try it like this: $scope.gridOptions = { ... onRegisterApi : function (gridApi) { $scope.gridApi = gridApi; $scope.gridApi.grid.modifyRows($scope.gridOptions.data); $scope.gridApi.selection.selectRow($scope.gridOptions.data[0]); } };

Collectives™ on Stack Overflow

How to select the first row by default in UI-grid in angular JS

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related