Pre-Select rows on load with angular-ui-grid

Question

I want to select certain rows on page load(working days)

This is the plunker plnkr.co/edit/48NyxngWNGIlOps1Arew?p=preview

Any suggestion?

Answer 1

Add the following property to your $scope.gridOptions object :

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

This sets a $scope.gridApi so you can access it if you need it outside of this function.

You need to call the modifyRows method in order to be able to make changes to your rows.

Then the first row is selected (just as an example).

http://plnkr.co/edit/mvwlfaJiPDysbn2IrNpv?p=preview

To select the working days, maybe you can try replacing the last line by something like this :

$scope.gridOptions.data.forEach(function (row, index) {
    if (row.isWorkingDay()) {
        $scope.gridApi.selection.selectRow($scope.gridOptions.data[index]);
    }
});

row.isWorkingDay can simply check if the day is among a list of given days.

If your data is loaded by an async call you can simply select the rows in the callback :

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