Skip to content

Commit

Permalink
Merge pull request #25 from Jakobovski/master
Browse files Browse the repository at this point in the history
Fixed minor typo
  • Loading branch information
Huei Tan committed Jul 2, 2014
2 parents 672bca5 + 172fd8c commit a3fbc29
Show file tree
Hide file tree
Showing 3 changed files with 93 additions and 61 deletions.
70 changes: 70 additions & 0 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
Adding a new validation
=====
**Clone the repo to your computer**
```
git clone https://github.com/huei90/angular-validation.git
```

**Install Grunt and Download dependencies**
```
npm install -g grunt-cli
npm install
```

**Before coding** <small>Boot the Environment</small>
```
grunt dev
```

**Start coding**
```
open `provider.js`, looking for `var expression` and `var defaultMsg`
Adding a new expression and defaultMsg to extend it
```

**IP validation** <small>As the example</small>
```javascript
// provider.js
var expression = {
required: /.+/gi,
... // add new expression below
ip: /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/
};

var defaultMsg = {
required: {
error: 'This should be Required!!',
success: 'It\'s Required'
},
... // add new valid message below
ip: {
error: 'This isn\'t ip',
success: 'It\'s IP'
}
};
```
**Test**
```
Karma Test done by Travis-ci,
When you are done, test it on `http://localhost:8080`
```

**Give me a PR** <small> Thanks for it </small>

**Who does the exactly same job ?**

1. https://github.com/kelp404/angular-validator
2. https://github.com/nelsonomuto/angular-ui-form-validation
3. (Waiting list..)


**Note**

1. More Status
https://github.com/angular/angular.js/issues/583#issuecomment-31277556
2. ngForm module ideas
https://docs.google.com/document/d/192dCUnoIBQ7-vurvPeS9BElGdxfk0Ddcof2KzDDi1Mc/edit
3. form-angular
http://www.forms-angular.org/
4. Html5 form-validation
http://www.sitepoint.com/client-side-form-validation-html5/
80 changes: 21 additions & 59 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -288,80 +288,42 @@ Built-in validation <small>in angular-validation</small>

Anyone can give a `PR` for this angular-validation for more `built-in validation`

Developer <small>Adding a new validation</small>

Integrating with Twitter Bootstrap
=====
**Clone the repo to your computer**
```
git clone https://github.com/huei90/angular-validation.git
```

**Install Grunt and Download dependencies**
```
npm install -g grunt-cli
npm install
```
To integrate this package with Bootstrap you should do the following.

**Before coding** <small>Boot the Environment</small>
```
grunt dev
```

**Start coding**
```
open `provider.js`, looking for `var expression` and `var defaultMsg`
Adding a new expression and defaultMsg to extend it
```
Add the following LESS to your project

```css
.ng-invalid.ng-dirty{
.has-error .form-control;
}

label.has-error.control-label {
.has-error .control-label;
}

**IP validation** <small>As the example</small>
```javascript
// provider.js
var expression = {
required: /.+/gi,
... // add new expression below
ip: /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/
};

var defaultMsg = {
required: {
error: 'This should be Required!!',
success: 'It\'s Required'
},
... // add new valid message below
ip: {
error: 'This isn\'t ip',
success: 'It\'s IP'
}
};
```
**Test**
```
Karma Test done by Travis-ci,
When you are done, test it on `http://localhost:8080`
```

**Give me a PR** <small> Thanks for it </small>

**Who does the exactly same job ?**

1. https://github.com/kelp404/angular-validator
2. https://github.com/nelsonomuto/angular-ui-form-validation
3. (Waiting list..)
Change the Error HTML to something like:

```javascript
$validationProvider.setErrorHTML(function (msg) {
return "<label class=\"control-label has-error\">" + msg + "</label>";
});
```

**Note**
You can add the bootstrap class `.has-success` in a similar fashion.

1. More Status
https://github.com/angular/angular.js/issues/583#issuecomment-31277556
2. ngForm module ideas
https://docs.google.com/document/d/192dCUnoIBQ7-vurvPeS9BElGdxfk0Ddcof2KzDDi1Mc/edit
3. form-angular
http://www.forms-angular.org/
4. Html5 form-validation
http://www.sitepoint.com/client-side-form-validation-html5/

CHANGELOG
=====
see [release](https://github.com/huei90/angular-validation/releases)
See [release](https://github.com/huei90/angular-validation/releases)

Q & A
=====
Expand Down
4 changes: 2 additions & 2 deletions src/directive.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
$timeout = $injector.get('$timeout');

/**
* Do this function iff validation valid
* Do this function if validation valid
* @param element
* @param validMessage
* @param validation
Expand All @@ -29,7 +29,7 @@


/**
* Do this function iff validation invalid
* Do this function if validation invalid
* @param element
* @param validMessage
* @param validation
Expand Down

0 comments on commit a3fbc29

Please sign in to comment.