Angular ui-grid row selection call function

Question

I am adding a ui-grid and want to be able to select a row and call a function. I also need to send to the function the data from the entire row (only a couple of columns are actually displayed), however I need the complete row passed to the function.

here are my options for the grid so fa:

    $scope.gridOptions = {
        enablePaginationControls: false,
        paginationPageSize: 25,
        multiSelect: false,
        columnDefs: [
            {
                name: 'userInfo.firstName',
                displayName: "First Name",
            }, {
                name: 'userInfo.lastName',
                displayName: "First Name"
            }
        ]
    };

Kathir · Accepted Answer · 2015-05-15 17:25:29Z

3

You have to use ui-grid-selection directive on the html and enable the row selection property on the gridOptions. Once you do that the row selection can be captured and the entire row data can be used for further processing.

 $scope.gridOptions = {
 enableRowSelection: true,
        enablePaginationControls: false,
        paginationPageSize: 25,
        multiSelect: false,
        columnDefs: [
            {
                name: 'userInfo.firstName',
                displayName: "First Name",
            }, {
                name: 'userInfo.lastName',
                displayName: "First Name"
            }
        ]
    };

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

            //Call your method here with the row object. row.entity will give the data.
          });
      };

In the html you need to add the ui

<div ui-grid="gridOptions" ui-grid-selection class="grid"></div>

A working model is here with out the call

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

answered May 15, 2015 at 17:25

Kathir

6,2068 gold badges38 silver badges68 bronze badges

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

3 Comments

lascoff Over a year ago

Is it possible to change the mouse cursor when over a road?

lascoff Over a year ago

sorry, I don't understand your reply.

Kathir Over a year ago

add that to your css. that will get hand cursor on the row.

Collectives™ on Stack Overflow

Angular ui-grid row selection call function

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related