var app = angular.module('plunker', ['validation', 'validation.rule', 'validation.schema']);
// Using config phase to add Schema's to schemaProvider
app.config(function(validationSchemaProvider) {
var Author = {
globals: {
'validations': 'required',
'validate-on': 'blur',
'messages': {
'required': {
'error': 'We need it',
'success': 'All good'
}
}
},
firstname: {
},
url: {
}
};
validationSchemaProvider.set("Author", Author);
});
app.controller('MainCtrl', function($scope, $validation) {
$scope.next = function(form) {
$validation.validate(form)
.success(function() {
console.log($scope.author);
})
.error(function() {
});
};
});
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link href="style.css" rel="stylesheet" />
<script data-semver="1.3.12" src="https://code.angularjs.org/1.3.12/angular.js" data-require="angular.js@1.3.x"></script>
<script src="//cdn.rawgit.com/huei90/angular-validation/master/dist/angular-validation.js"></script>
<script src="//cdn.rawgit.com/huei90/angular-validation/master/dist/angular-validation-rule.min.js"></script>
<script src="//cdn.rawgit.com/thetutlage/angular-validation-schema/master/angular-validation-schema.min.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<form name="Form" validation-schema schema="Author">
<div>
<label> Firstname </label>
<br />
<input type="text" name="firstname" ng-model="author.firstname" />
</div>
<br />
<div>
<label> Url </label>
<br />
<input type="text" name="url" ng-model="author.url" />
</div>
<br />
<div>
<button ng-click="next(Form)"> Submit </button>
</div>
</form>
</body>
</html>
/* Put your css in here */