Getting Row Value for Kendo UI Grid in AngularJS

Question

Starting out on AngularJS and KendoUI Grid. I'd like to get the row value for a defined grid.

I've defined a button template in my Kendo UI Grid as follows:

$scope.gridOptions = {
  dataSource: {
                type: "json",
                data: $scope.teams,
                pageSize: 5
            },
  sortable: true,
  selectable: row,
  columns: [
    {field: "TeamID", title: "Team ID"},
    {field: "TeamName", title: "Name" },
    {field: "TeamDistrict", title: "District"},
    {
     template: "<button class=\"k-button\" ng-click=\"manageTeam(#=TeamID#)\">Manage</button>"
    }
  ]
};

I also defined a function as follows:

$scope.manageTeam = function(tid){
  console.log(tid);
};

I am getting the value for the passed Team ID, but I wanted to grab the whole row value into an object so that I can get it like:

$scope.manageTeam = function(rowValue){
  console.log(rowValue.TeamID);
  console.log(rowValue.TeamName);
  console.log(rowValue.TeamDistrict);
};

Appreciate any insight on how to achieve this. Thanks.

Try using #=this# instead of #=TeamID# in the manageTeam() call of your button template. I'm not sure what you'll get, but it's worth a shot. — Brett
Tried. Got error: Error: [$parse:syntax] Syntax Error: Token 'Window' is unexpected, expecting []] at column — Batuta

Batuta Batuta · Accepted Answer · 2014-10-16T17:30:15

Thanks to @CSharper, I was able to map out the answer.

The key is to change the template attribute in the columns declaration to:

template: "<button class=\"k-button\" ng-click=\"manageTeam(this.dataItem)\">Manage</button>"

Hope someone finds this stuff useful.

Getting Row Value for Kendo UI Grid in AngularJS

1 Answers