Geek Answers Handbook

How to select next line in Angular UI grid?

I have the selected line and clicking on a button (currently I use the spacebar through AngularHotkeys.js ) I want to deselect the current line and select the one that is next to the current one.

The thing is more complicated, knowing that I can sort a table with different columns. Thus, it would be great to know the index of the current row with the current sort applied.

Where to start with this problem?
Any suggestions are welcome.

+5
source share
2 answers

You can get an array of rows in their sorted and filtered state from $scope.gridApi.grid.renderContainers.body.visibleRowCache . There's also a ton of tricks to deal with when you have an entity and when you have a gridRow, so the code gets a little complicated.

Your code will look something like this:

 $scope.selectNextRow = function() { var currentRowIndex; var selectedRows = $scope.gridApi.selection.getSelectedRows(); if( selectedRows.length < 1 ){ // if nothing selected, we'll select the top row currentRowIndex = -1; } else { // if there are multiple selected, we use the first one var selectedRow = selectedRows[0]; var gridRow = $scope.gridApi.grid.getRow(selectedRow); currentRowIndex = $scope.gridApi.grid.renderContainers.body.visibleRowCache.indexOf(gridRow); } $scope.gridApi.selection.clearSelectedRows(); $scope.gridApi.selection.selectRow($scope.gridApi.grid.renderContainers.body.visibleRowCache[currentRowIndex + 1].entity); };

Contact http://plnkr.co/edit/Z7HCjVY6oxGJzyjLI6Qo?p=preview

+2
source

If I understand you correctly, you should be able to do what you want with something like that. (Not tested this)

 $scope.scrollTo = function( rowIndex ) { $scope.gridApi.core.scrollTo( $scope.gridOptions.data[rowIndex], 0); }; $scope.nextRow() { var current = $scope.gridApi.selection.getSelectedRows(); scrollTo(current + 1); }

Greetings

-1
source

More articles:


All Articles