Recently, I developed a web application using AngularJS. One of the features I included was an input text box with a custom ng-on-blur event handler.
Due to some issues with ng-blur, I decided to create my own custom directive called ngOnBlur. Here's how it appears in my code:
app.directive('ngOnBlur', function($parse){
return function(scope, elm, attrs){
var onBlurFunction = $parse(attrs['ngOnBlur']);
elm.bind("blur", function(event) {
scope.$apply(function() {
onBlurFunction(scope, { $event: event });
})});
};
});
The problem arises when I enter text into the textbox and then quickly click on another button in my app (which triggers a ng-click event). Unfortunately, the ng-on-blur event does not get triggered at all and the click event takes precedence.
I'm looking for suggestions on how to adjust the priority of my custom event. Here is what the html currently looks like:
<input type="text" ng-model="x.y" ng-on-blur="doSomething()" />
I have even tried setting the priority to 100 but it doesn't seem to solve the issue. Any advice or solutions would be greatly appreciated.