angularjs ui-grid 3.0 key navigation

Question

I'm keen on migrating from ng-grid 2 to the new ui-grid 3.0 replacement. So far things look nice. One thing I can't figure out though is how to enable navigating through the records with the up and down arrows keys. This worked out of the box with ng-grid when multiSelect was set to false.

Answer 1

I modified mainguy's Plunker a little bit to achieve what you want.

The main difference is to use ui-grid-selection

<div ng-controller="MainCtrl">
  <div ui-grid="gridOptions" ui-grid-selection></div>
</div>

and 2 options: enableRowHeaderSelection and multiSelect.

$scope.gridOptions = {
  enableRowHeaderSelection: false,
  multiSelect: false
};

Here is the Plunker.

---

UPDATE: The below code will help to select the whole row when you use the arrow keys.

$scope.gridOptions.onRegisterApi = function(gridApi){
  $scope.gridApi = gridApi;

  gridApi.cellNav.on.navigate($scope,function(newRowCol, oldRowCol){
    $scope.gridApi.selection.selectRow(newRowCol.row.entity);
  });
};

Here is the Plunker.