https://github.com/Osedea/angular-osd-form
A form validation directive in AngularJS
https://github.com/Osedea/angular-osd-form
Last synced: about 2 months ago
JSON representation
A form validation directive in AngularJS
- Host: GitHub
- URL: https://github.com/Osedea/angular-osd-form
- Owner: Osedea
- License: mit
- Created: 2015-01-20T22:37:38.000Z (over 11 years ago)
- Default Branch: master
- Last Pushed: 2020-07-29T20:42:59.000Z (almost 6 years ago)
- Last Synced: 2026-04-01T07:56:04.436Z (2 months ago)
- Language: JavaScript
- Homepage:
- Size: 53.7 KB
- Stars: 8
- Watchers: 26
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://travis-ci.org/Osedea/angular-osd-form)
# angular-osd-form
This module provides easy form validation in AngularJS. There are three directives included in the module:
- osd-submit (calls a given function if validation passes)
- osd-field (adds an error class if field is invalid)
- osd-error (displays error messages for invalid fields)
### Version
0.1.26
### Installation and Setup
This package can be installed using bower:
```sh
$ bower install angular-osd-form
```
Add the module to your app's module list:
```js
angular.module(
'app',
[
...,
'osdForm',
]
)
```
Include a script tag for ng-lodash and osd-form (or add them to whatever you use to compile your js):
```html
```
### Example
A registration form to be validated using angular-osd-form:
```html
Name
Email
Password
Password Confirmation
Continue
```
### osd-submit
The osd-submit directive validates all fields and calls the given function if the form is valid. Validation only occurs when the form is submitted. A name attribute must be provided along witht the osd-submit directive.
```js
```
If any field is invalid on submission, an event will be broadcasted on $rootScope, passing the Angular FormController:
```js
$rootScope.$broadcast('osdInvalid', ngFormCtrl);
```
Validation can be forced using the 'osdValidate' event:
```js
$scope.$broadcast('osdValidate');
```
The form validation status can be reset with the 'osdReset' event:
```js
$scope.$broadcast('osdReset');
```
### osd-field
Defines the name of the field that will be validated and adds an error class if the field is invalid. There must be a form field with the same name, and an ng-model directive.
```js
```
### osd-error
Accepts an error type, an error message, and an optional validator function. The error types are the same as those provided by Angular's FormController, with 'required' being the default. See https://docs.angularjs.org/api/ng/type/form.FormController for information on the available error types.
```js
```
If a validator is given, the error-type is not required:
```js
```
### Default validators
The osdError directive comes with several default validators. These can be used in the same way as custom validators:
```js
```
In the example above, the validator will check that the field value is in the past.
The following default validators are available:
- pastDateValidator()
- futureDateValidator()
### Multi-field validators
The osdError directive comes with several multi-field validators. These can be used to validate based on multiple fields in your form. The osdError directive accepts a built-in validator name and an array of attributes to check. The most common example is checking that the password confirmation field matches the password field:
```js
```
In the example above, the validator will check that the password and passwordConfirmation fields are strictly equal.
The following multi-field validators are available:
- strictMatchValidator()
- strictIncreaseValidator()
### Bootstrap vs. Semantic UI
By default the project supports Bootstrap but you can change to using Semantic UI by injecting the OsdFormConfigProvider into your app's config and calling:
```js
OsdFormConfigProvider.useSemanticUi();
```
### License
The MIT License (MIT)
Copyright (c) 2015 damacisaac
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.