Angularjs Examples

AJS Examples


AngularJS ng-Required Directive

The AngularJS ng-required directive is used for input and select controls to set as required field, but can also be applied to custom controls.

Syntax

<input type="text" ng-model="model" id="input" name="input" 
ng-required="requiredValue" /><br>

AngularJS ng-Required Directive Example

<!DOCTYPE html>      
<html>      
<head> <!-- www.techstrikers.com -->      
<title>ngRequired Test Sample</title>      
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>      
      
<script>      
  var app = angular.module('ngRequiredExample', [])  
    app.controller('ngRequiredController', ['$scope', function($scope) {  
      $scope.requiredValue = true;  
    }]);    
</script>      
</head>      
<body style="background-color:#DDE4E9;" ng-app="ngRequiredExample">      
  <fieldset style="background-color:#DDE4E9;">        
    <legend>AngulerJS ngRequired Example</legend>        
<div ng-controller="ngRequiredController" style="font-family:arial;">  
  <form name="myform">
    <label for="requiredValue">Is Required: </label>
    <input type="checkbox" ng-model="requiredValue" id="required" />
    <br/><br/>
    <label for="input">Enter Name if 'Is Required' is true: </label>
    <input type="text" ng-model="model" id="input" name="input" ng-required="requiredValue" /><br>
      
<p style="font-family:Arial;color:red;background:steelblue;padding:3px;width:350px;"   
        ng-show='myform.input.$error.required'>Name is required</p>    
  </form>  
</div>  
      </fieldset>       
</body>      
</html>  
See Live Example