angular js:UI网格设置onclick事件行并标识单击的行

时间:2016-05-05 06:09:26

标签: angularjs

   $http({
            method: 'GET',
            url: "http://localhost:9080/ProdMakerDev/pm/managejobs/search/"+val
        }).then(function successCallback(response) {
            $scope.gridOptions.data = response.data;

        }, function errorCallback(response) {
        }); 
    }
    $scope.gridOptions = {
            columnDefs: [
                         { name:'Status', field: 'Status', width: "65", cellTemplate:"<div class={{row.entity.Status}}></div>"},
                         { name:'', field:'edit/delete/startnow' , width: "70", 
                             cellTemplate:" <img src='Images/edit.gif' /> <img src='Images/delete.gif' /> <img src='Images/startnow.gif' />"   },
                         { name:'Jobname', field: 'Jobname', width: "297"},
                         ]
    };

enter image description here 在上面的截图中。点击编辑按钮编辑名称&amp;删除反之亦然。

请帮帮我。

1 个答案:

答案 0 :(得分:1)

如果要将任何事件附加到行元素,可以使用下面的代码。

ng-click =“grid.appScope。&lt;&gt;(row,$ event)”

例如:

$scope.gridOptions = {
            columnDefs: [
                         { name:'Status', field: 'Status', width: "65", cellTemplate:"<div class={{row.entity.Status}}></div>"},
                         { name:'', field:'edit/delete/startnow' , width: "70", 
                             cellTemplate:' <img ng-click="grid.appScope.edit(row, $event)" src='Images/edit.gif' /> <img src='Images/delete.gif' ng-click="grid.appScope.delete(row, $event)" /> <img src='Images/startnow.gif' ng-click="grid.appScope.startNow(row, $event)"  />'   },
                         { name:'Jobname', field: 'Jobname', width: "297"},
                         ]
    };

在控制器中:

$scope.edit = function(row, $event) {
  var element = $event.currnetTarget;
  var rowObj = row.entity[your-data-object];
}