angular1.3 form validation ngmessages

ngmessages in action

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/foundation/5.4.6/css/foundation.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular-messages.js"></script>
<div ng-app="formApp">
    <form name="userForm" novalidate>
        <div>
            <input type="text" ng-model="user.name" name="name" placeholder="Name" required="required"/>    
            
            <div ng-messages="userForm.name.$error">
                <div ng-message="required">
                    enter a valid name
                </div>
            </div>
        </div>
        <div>
            <button type="reset" ng-disabled="userForm.$pristine">Reset</button>  
            <button type="submit" ng-disabled="!userForm.$valid">Register</button>    
        </div>
    </form>
</div>

JavaScript

angular.module('formApp',['ngMessages']);