Getting select rows from ng-grid?

Question

How do I create (or access) an array of selected rows in my ng-grid?

Documentation (scroll to "Grid options")

id                 | default value | definition
-----------------------------------------------
selectedItems      |       []      | all of the items selected in the grid.
                                     In single select mode there will only
                                     be one item in the array.

index.html

<body ng-controller="MyCtrl">
    <div class="gridStyle" ng-grid="gridOptions"></div>

    <h3>Rows selected</h3>
    <pre>{{selectedItems}}</pre>
</body>

main.js

var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope) {
    $scope.myData = [{name: "Moroni", age: 50},
                     {name: "Tiancum", age: 43},
                     {name: "Jacob", age: 27},
                     {name: "Nephi", age: 29},
                     {name: "Enos", age: 34}];
    $scope.gridOptions = { data: 'myData' };
});

Plnkr for the code (and to run it)

score 23 · Accepted Answer · answered Jun 01 '13 at 17:38

23

Based on the doc, selectedItems should be a property of $scope.gridOptions, so try this:

Controller

$scope.gridOptions = { data: 'myData', selectedItems: [] };

HTML

<pre>{{gridOptions.selectedItems}}</pre>

answered Jun 01 '13 at 17:38

Ye Liu

8,946
1
38
34

2

Thanks, had thought it was a default option; due to it having a default value; guess I won't expect that again. It's working :) – Foo Stack Jun 01 '13 at 17:50

score 7 · Answer 2 · answered Aug 06 '14 at 16:31

7

You can get selected items of ng-grid 2.x from:

$scope.gridOptions.$gridScope.selectedItems

answered Aug 06 '14 at 16:31

ThanhHH

6,560
1
19
22

score 4 · Answer 3 · answered Nov 27 '14 at 09:01

4

In version 3 you can do:

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

  $scope.gridApi = gridApi;
  $scope.mySelectedRows=$scope.gridApi.selection.getSelectedRows();
}

Refer to http://ui-grid.info/docs/#/api/ui.grid.selection.api:PublicApi for more info.

answered Nov 27 '14 at 09:01

Atomic Star

5,427
4
39
48

I had multiple grids on my page and it seemed to cause problems with setting the `$scope.mySelectedRows`, even with unique values, I am not sure why as it should work fine. I was however still able to get to each grid using `$scope.uniqueGridApi.selection.getSelectedRows()`. – JabberwockyDecompiler Apr 14 '15 at 15:40

score 3 · Answer 4 · answered Oct 05 '14 at 13:15

3

For 3.0, you can capture rows as they're selected like this:

$scope.gridOptions.onRegisterApi = function(gridApi){
  //set gridApi on scope
  $scope.gridApi = gridApi;
  gridApi.selection.on.rowSelectionChanged($scope,function(row){
    var msg = 'row selected ' + row.isSelected;
    $log.log(msg);
  });
};

More info here: http://ui-grid.info/docs/#/tutorial/210_selection

answered Oct 05 '14 at 13:15

genegc

1,630
18
16

Although this is an acceptable solution, I prefer the answer from `Ewald Stieger` because it has less code to maintain. – JabberwockyDecompiler Apr 14 '15 at 15:42

score 1 · Answer 5 · answered Jul 18 '14 at 23:14

1

I'm attempting to read a list of selected rows at the moment. The option appears to have moved, I can now find this in:

$scope.gridOptions.ngGrid.config.selectedItems

It appears to be read-only

answered Jul 18 '14 at 23:14

PaulL

6,650
3
35
39

This was a life saver for me. The selectedItems property I tried to set this to was not working -- this does! – udog Feb 20 '15 at 19:00

Getting select rows from ng-grid?

Documentation (scroll to "Grid options")

index.html

main.js

5 Answers5

Linked