CODEWITHSUNDEEP
angularjs
vishnu
vishnu

Reputation: 4599

call a angular directive from controller

I have a mobi scroll date picker and i have done the age validation using directive. I am doing multi step form validation for the signup process. How do i call the directive again(i.e age validation) if i click on the back button.

<input type="text" id="dateOfBirth" placeholder="Please Select ..."  data-ng-model="personalDetailsObj.personalDetails.dob" name="dob" ng-required="true" age-valid mobi-date=true />

directive

.directive('ageValid', ['$filter', function($filter) {
  return {
    restrict: 'A',
    require: 'ngModel',        
    link: function(scope, element, attrs, ngModel) {
      ngModel.$validators.validAge = function(modelValue, viewValue) {
        var todayDate = new Date(),
          todayYear = todayDate.getFullYear(),
          todayMonth = todayDate.getMonth(),
          todayDay = todayDate.getDate(),
          dateFieldVal = viewValue,
          birthYear = viewValue.split('/')[2],
          birthMonth = viewValue.split('/')[1],
          birthDay = viewValue.split('/')[0],
          age = todayYear - parseInt(birthYear);

          if(todayMonth < parseInt(birthMonth) - 1){
            age--;
          }
          if(parseInt(birthMonth) - 1 === todayMonth && todayDay < parseInt(birthDay)){
            age--;
          }                  
          return age >= 21;
      };
    } 
  }
}])

controller

$scope.backbutton = function(){

};

Upvotes: 1

Views: 52

Answers (2)

S&#233;bastien Ollivier
S&#233;bastien Ollivier

Reputation: 578

You could extend the controller scope from your directive. In your case, you use the same scope from your directive (by not specifying the scopeproperty), so your code may look like =>

// Directive

.directive('ageValid', ['$filter', function($filter) {
  return {
    restrict: 'A',
    require: 'ngModel',        
    link: function(scope, element, attrs, ngModel) {
      scope.doSomething = function() {
        console.log("hello");
      }
    } 
  }
}])

// Controller

$scope.backbutton = function(){
  $scope.doSomething();
};

Upvotes: 0

Javierif
Javierif

Reputation: 632

U should use a factory as an intermediate like:

DIRECTIVE:

.directive('ageValid', ['$filter','Age', function($filter,Age) {
  return {
    restrict: 'A',
    require: 'ngModel',        
    link: function(scope, element, attrs, ngModel) {
      ngModel.$validators.validAge = function(modelValue, viewValue) {
       return Age.ageValidation(modelValue, viewValue);
      };
    } 
  }
}])

Controller:

$scope.backbutton = function(){

};

Factory:

.factory("Age", function (NombresGuardado) {

    return {
        ageValidation: function (modelValue, viewValue) {
             var todayDate = new Date(),
              todayYear = todayDate.getFullYear(),
              todayMonth = todayDate.getMonth(),
              todayDay = todayDate.getDate(),
              dateFieldVal = viewValue,
              birthYear = viewValue.split('/')[2],
              birthMonth = viewValue.split('/')[1],
              birthDay = viewValue.split('/')[0],
              age = todayYear - parseInt(birthYear);

              if(todayMonth < parseInt(birthMonth) - 1){
                age--;
              }
              if(parseInt(birthMonth) - 1 === todayMonth && todayDay < parseInt(birthDay)){
                age--;
              }                  
              return age >= 21;
        }
    }

Upvotes: 3

Related Questions