Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ruk33/form-validation
A super-light, flexible, easy-to-use form validation in javascript (requires jQuery)
https://github.com/ruk33/form-validation
Last synced: about 2 months ago
JSON representation
A super-light, flexible, easy-to-use form validation in javascript (requires jQuery)
- Host: GitHub
- URL: https://github.com/ruk33/form-validation
- Owner: Ruk33
- License: mit
- Created: 2013-03-05T01:54:29.000Z (almost 12 years ago)
- Default Branch: master
- Last Pushed: 2015-11-15T19:09:18.000Z (about 9 years ago)
- Last Synced: 2023-05-05T16:20:07.509Z (over 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 235 KB
- Stars: 17
- Watchers: 5
- Forks: 10
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
form-validation
=
A super-light (2 KB minified), flexible, easy-to-use form validation in javascript (requires [jQuery](http://jquery.com/)).
How to use it?
-
First, we need to set some validation rules:
```javascript
var rules = {
'idOfTheField': {
minLength: {
value: 2,
message: 'This field must have at least 2 characters'
},
maxLength: {
value: 7,
message: 'This field can contain maximum 7 characters'
}
}
};
```
As you can see, we set that the field must have at least 2 characters and a maximum of 7.
Then, we need to set up this rules into the form:
```javascript
$('#form-to-validate').setValidationRules(
rules,
function() {
console.log('Form sucessfully validated :D');
}
);
```
And we are done!. When the user submits the form, it will be validated.
Suported validations
-
###Equal
The field must be equal to...
####Example
```javascript
var rules = {
'idOfTheField': {
equal: {
value: 2,
message: 'This field must be 2'
}
}
};
```
Also, we can assign an element to check for the value:
```javascript
var rules = {
'idOfTheField': {
equal: {
value: $('#anotherField'),
message: 'This field must be equal to #anotherField'
}
}
};
```
###LessThan
For numbers (not number of characters).
####Example
```javascript
var rules = {
'idOfTheField': {
lessThan: {
value: 2,
message: 'This field must be less than 2'
}
}
};
```
###GreaterThan
For numbers (not number of characters).
####Example
```javascript
var rules = {
'idOfTheField': {
greaterThan: {
value: 2,
message: 'This field must be greater than 2'
}
}
};
```
###minLength/maxLength
This will look for the number of characters in the field.
####Example
```javascript
var rules = {
'idOfTheField': {
minLength: {
value: 2,
message: 'This field must have at least 2 characters'
},
maxLength: {
value: 4,
message: 'This field can contain maximum 4 characters'
}
}
};
```
###RegularExpression
This will compare a regular expresion with `test`.
####Example
```javascript
var rules = {
'idOfTheField': {
regularExpression: {
value: /\d/,
message: 'Only numbers (0-9)'
}
}
};
```
###Email
This uses RegularExpression (see above) to check for valid emails.
Regular expression: `/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/`
####Example
```javascript
var rules = {
'idOfTheField': {
email: {
message: 'Invalid email'
}
}
};
```
##How to add my custom validation?
You can use the `addCustomFormValidation` function:
```javascript
addCustomFormValidation('catLanguage', function(input, data) {
return input.val() == 'Miau';
});
```
And then, we can use it:
```javascript
'input': {
catLanguage: {
message: 'That is not a cat word!'
}
}
```
In this example, the field must be 'Miau'.
##Want to see a full example?
Please check the **examples** folder ;).
##LICENCE
MIT