AngularJS ng-grid with custom button

Question

I am using angular button in a ng-grid. I need to know how can i identity which button was clicked from within the grid.

I guess part of the complexity is that the button is clicked before the row is selected (Just my analysis,probably wont help with the solution :)

A snap shot of how the grid looks

A plunker illustrating the problem here

Cowrie

Answer 1

I have been able to find out how to resolve my question,basically pass in "row" as an argument on your function for ng-click. ng-click="save(row)"

Before

.. ng-click="edit(selectedItem)" >Edit</button> '

After

.. ng-click="edit(row)" >Edit</button> '

I have updated the plunker here to reflect the same

row.entity will give me the entity bound to this row of the grid

Cowrie

Perfect, thank you! Where did you find info on the entity object? – Jadejaded

I am sorry, i have kind of lost touch with AngularJS, however i do remember looking it up on some blog and then having the same unanswered query, it would be great it someone could add to the answer – Cowrie

@Cowrie Do you know how to prevent the row from being selected when you press the "edit" button? – Lots

I found .entity in the js debugger. Yes, I'm taking a dependency on an undocumented property and am well aware of the risk. – Boor

Answer 2

@Shai Aharoni You can prevent the row from being selected by passing $event as the first argument to the click handler:

.. ng-click="edit($event, row)">Edit</button>

and then calling stopPropagation() on the event from inside the handler.

$scope.edit = function(event, row) { event.stopPropagation(); }

Completion