Angular- In directive, element validation always undefined

Question

I have a form , which is having few input fields. I want to display error message in popover when user focus out the input field or click on submit button. I created one directive which adds the popover attributes to the input fields. So when user moving out from the input field I will check validation, if validation fails want to show the popover. But when I try to check always I am getting undefined.

Can someone help me on this. My plunker

app.directive("errorTooltip", function($compile, $interpolate, $timeout) {
  return {
    scope: true,
    require: 'ngModel',
    link: function (scope, element, attr, ctrl) { 
          element.attr('popover-trigger', "'show'"); 
          element.attr('popover-placement', 'top');
          element.attr('uib-popover', element.attr("data-info"));

          var blurred = false;
          element.on("blur",function(event){
           blurred = true;
          });
          scope.$watch(function() {
            console.log(ctrl.$name.$invalid); //always comes undefined
            element.triggerHandler('show');
            return ctrl.$name.$invalid
          }, function(invalid) {
          if (!blurred && invalid) { 
              return
              }
             console.log("test")
              //element.toggleClass('has-error', invalid);

        });


    }
  };
});

Thanks in advance .

Marcus Höglund · Accepted Answer · 2017-02-09 08:26:48Z

1

Replace the line:

console.log(ctrl.$name.$invalid);

With this:

console.log(ctrl.$invalid);

Updated plunker here.

edited Feb 9, 2017 at 8:26

Marcus Höglund

16.9k11 gold badges53 silver badges72 bronze badges

answered Feb 9, 2017 at 8:22

Shalom Peles

2,63211 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

svk Over a year ago

do you have any idea how to show the popover when element validation gets failed ?

Collectives™ on Stack Overflow

Angular- In directive, element validation always undefined

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related