1. index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<!DOCTYPE html>
<html ng-app="fruitApp" lang="kr">
<head>
<meta charset='utf8'/>
<title>AngularJS 유효성검사</title>
<script src='http://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js'></script>
<script src="app.js"></script>
</head>
<body ng-app="fruitApp">
<form name='addUserForm' ng-controller='AddUserController'>
<div ng-show='message'>{{message}}</div>
<div> 이름 <input name='firstName' ng-model='user.first' required/></div>
<div> 성씨 : <input ng-model='user.last' required /></div>
<div> e-mail : <input type='email' ng-model='user.email' required /></div>
<div> 나이 : <input type='number'ng-model='user.age' ng-maxlength='3' ng-min='1'/></div>
<div><button ng-click='addUser()' ng-disabled='!addUserForm.$valid'>전송</button></div>
</form>
</body>
</html>
| cs |
2. app.js
1
2
3
4
5
6
7
8
9
|
var app=angular.module('fruitApp', []);
app.controller('AddUserController', function($scope) {
$scope.message = '';
$scope.addUser = function(){
$scope.message = 'THANK YOU';
}
});
| cs |
댓글 없음:
댓글 쓰기