javascript - ng-messages is not working -
<!doctype html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" type="text/css" href="login.css"> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-messages.min.js"></script> </head> <body ng-app="loginapp"> <div class="container"> <div class="login_logo"></div> </div> <div class="form_container"> <div ng-messages="form_login.username.$error"> <div class="alertmsg" ng-message="required">your username required</div> </div> <div class="form_left"> <form class="form_login" name="form_login" ng-controller="loginctrl" ng-submit="submitform()" novalidate> <div class="usr"> <input id="username" name="username" ng-model="username" type="text" autofocus="autofocus" required /> </div> <div class="psw"> <input id="password" name="password" ng-model="password" type="password" required /> </div> </form> </div> <div class="form_right"> <a class="submit" href="" ng-click="submitform()"></a> </div> <div class="clear"></div> </div> <script type="text/javascript"> var app = angular.module("loginapp", ["ngmessages"]); app.controller("loginctrl", function($scope) { $scope.username = "11"; $scope.password = ""; $scope.submitform = function() {}; }); </script> </body> </html> i'm trying use ng-messages simple validation login form, particular div displayed if username blank. can't find error code above. can check code? thanks.
you have 2 choices resolve problem. 1 option place ng-messages directive inside form. because defined scope loginctrl in form_login. if don't want move directive, have move ng-controller <form...> <div class="form_container" ng-controller="loginctrl">. following snippet shows second option
<div class="form_container" ng-controller="loginctrl"> <div ng-messages="form_login.username.$error"> <div class="alertmsg" ng-message="required">your username required</div> </div> <div class="form_left"> <form class="form_login" name="form_login" ng-submit="submitform()" novalidate> <div class="usr"> <input id="username" name="username" ng-model="username" type="text" autofocus="autofocus" required /> </div> <div class="psw"> <input id="password" name="password" ng-model="password" type="password" required /> </div> </form> </div> <div class="form_right"> <a class="submit" href="" ng-click="submitform()"> click</a> </div> <div class="clear"></div> </div> please note validating username input , has value.
Comments
Post a Comment