How can I force ng-click to take precedence over an ng-blur event?

Question

When I click the save button it triggers an ng-blur event, how can I make the buttons ng-click event to trigger instead? I still want the ng-blur event to trigger if I click

Answer 1

Instead of ng-click, use ng-mousedown. Mousedown events get fired before blur events.

However, the handled mousedown might un-focus your field without the blur event being fired. If you then click outside the box, the blur event won't be fired (because the field is already blurred), so after setting focus, you might need to re-focus the field manually - see How to set focus on input field?

Note that by using this approach, the button can also be triggered using right-click (thanks Alexandros Vellis!) as you can see in this official example.

Answer 2

If you want to run click event functionality before ng-blur than write your functionality in ng-mousedown event instead ng-click.

Answer 3

Don't use ng-blur then, bind the $document with click event to stop edit mode. And remember to unbind the event when the scope is destroyed.