AngularJs Form Validation For Edit Page

Question

I have used the error form validation in the addnewstudent page as below and it's working fine.

  <td>
   <input limit-to="50" type="email" name="input" ng-model="Email" />
   <span style="display:none">{{ emailValid = !!myForm.$error.email}}</span>
   <span ng-class="customStyle.colorClass">
    {{EmailValidation }}
   </span>
  </td>

Same approach I used for my edit page as like below, but Iam not able to get the bool value of "!!myForm.$error".

my Edit page

 <td>
  <input limit-to="50" type="text" ng-model="Student.email" />
  <span style="display:none">{{ emailValid = !!myForm.$error.Student.email}}
  </span>
    <span>
       {{EmailValidation }} 
   </span>
 </td>

My JS,

 $scope.save = function () {

    if ($scope.emailValid || $scope.Student.email=='') {
        $scope.EmailValidation = 'Not a valid email (ex: [email protected])';
        return;
    }
    else {
        $scope.EmailValidation = '';
    }
.......
.......

Where I did go wrong on my edit page?

What is your ultimate goal ? check whether input value is a email or not ? — Ebin Manuval
– Ebin Manuval, Commented Nov 25, 2018 at 8:03

Ebin Manuval · Accepted Answer · 2018-11-25 08:22:03Z

To validate a form input in angularjs there should be name attribute for that input and form also.

angular.module('sampleApp', [])
  .controller('myCtrl', function($scope) {
    $scope.Student = {}
  })

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app="sampleApp" ng-controller="myCtrl" >
  <form name="myForm" novalidate>
    <input limit-to="50" type="email" ng-model="Student.email" name="email" required/>
    <div ng-show="myForm.$submitted || myForm.email.$touched">
      <span ng-show="myForm.email.$error.required">Tell us your email.</span>
      <span ng-show="myForm.email.$error.email">This is not a valid email.</span>
    </div>
    <button>Submit</button>
  </form>
</div>

Above code will check for non empty valid email, which is done by required,type="email" attributes.

Collectives™ on Stack Overflow

AngularJs Form Validation For Edit Page

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related