domoindal domoindal - 8 months ago 51
AngularJS Question

AngularJS validation errors

I have a working form with ngMessages.

My issue is that when displayed the form and then empty, i do not want to show errors, only when the user has focused out the input.

Is this possible?


Use $touched:


var app = angular.module('app', ['ngMessages']);

app.controller('mainCtrl', function($scope) {
  // Any JS Code
<!DOCTYPE html>
<html ng-app="app">

  <script src=""></script>
  <link rel="stylesheet" href="//" />
  <script src=""></script>
  <script src="//"></script>
  <script src=""></script>

<body ng-controller="mainCtrl">
  <form role="form" name="form" novalidate>
    <div class="col-md-12">
      <div class="form-group" ng-class="{ 'has-error' :$touched &&$invalid }">
        <input type="email" name="email" class="form-control" placeholder="Name" ng-model="email" required>
        <div class="help-block" ng-messages="$error" ng-if="$touched">
          <p ng-message="required">This field is required</p>
          <p ng-message="minlength">This field is too short</p>
          <p ng-message="maxlength">This field is too long</p>
          <p ng-message="required">This field is required</p>
          <p ng-message="email">This needs to be a valid email</p>


For more check here.

I hope it helps!