When I use celltemplate for ahref link, once the link is clicked the row highlights because i have RowSelection enabled...but i dont want the row to highlight when the link is clicked..only if the row is clicked anywhere but the link.
Also in my below example picture, how do I remove the little arrow so no Menuitems can be displayed for that column?
Code:
$scope.gridOptions = {
showFooter: true,
enableFiltering: true,
enableRowSelection: true,
enableRowHeaderSelection: false,
enableSelectAll: true,
multiSelect: true,
enableColumnResizing: true,
columnDefs: [
{ field:'date', displayName: 'Date', width: 200, aggregationType: uiGridConstants.aggregationTypes.count },
{ field:'notes', displayName: 'Notes', width: 65, enableFiltering: false, enableSorting: false, enableHiding: false, cellTemplate:'<a href="#" ng-click="getExternalScopes().showMe(row.entity[col.field])">View</a>' }
],
data: data
}
Pic:
The simple solution is change the
row.setSelected
tofalse
Here is a possible answer to ui-grid (which is not ng-grid anymore!).
The cell template for a button that does not select the row is:
Note the
$event.stopPropagation()
in the ng-click directive. This will hinder the click to reach the underlying functions of the rowTemplate. (Note also that I didn't found another way to pass a click event to the controller than by using externalScopes. I'm sure there is a better way but ui-grid is still beta and I'm also pretty new to it)Second part of your question: Use this headCellTemplate
and add it to the respective columns in your columnDefs.
Here is a Plunker with everything included.
Please don't tell me you meant ng-grid:-)