angular-validation-match

WebJar for angular-validation-match

License

License

MIT
Categories

Categories

Angular User Interface Web Frameworks
GroupId

GroupId

org.webjars.bower
ArtifactId

ArtifactId

angular-validation-match
Last Version

Last Version

1.9.0
Release Date

Release Date

Type

Type

jar
Description

Description

angular-validation-match
WebJar for angular-validation-match
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/TheSharpieOne/angular-validation-match

Download angular-validation-match

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bower/angular-validation-match/ -->
<dependency>
    <groupId>org.webjars.bower</groupId>
    <artifactId>angular-validation-match</artifactId>
    <version>1.9.0</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bower/angular-validation-match/
implementation 'org.webjars.bower:angular-validation-match:1.9.0'
// https://jarcasting.com/artifacts/org.webjars.bower/angular-validation-match/
implementation ("org.webjars.bower:angular-validation-match:1.9.0")
'org.webjars.bower:angular-validation-match:jar:1.9.0'
<dependency org="org.webjars.bower" name="angular-validation-match" rev="1.9.0">
  <artifact name="angular-validation-match" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bower', module='angular-validation-match', version='1.9.0')
)
libraryDependencies += "org.webjars.bower" % "angular-validation-match" % "1.9.0"
[org.webjars.bower/angular-validation-match "1.9.0"]

Dependencies

compile (1)

Group / Artifact Type Version
org.webjars.bower : angular jar [1.3.0,2.0.0)

Project Modules

There are no modules declared in this project.

Build Status Code Climate Test Coverage Coverage Status Dependency Status devDependency Status

Angular Validation: Match

Checks if one input matches another. Useful for confirming passwords, emails, or anything.

The match attribute should be set equal to the ng-model value of the field to match.

Demo: http://jsfiddle.net/TheSharpieOne/r6Ltru6c/

Installation

bower install angular-validation-match

Then add validation.match to your angular dependencies

Note: For angular 1.2 or lower use bower install angular-validation-match#1.3

Also: npm install angular-validation-match

Usage

Simple Property Example

Password: <input ng-model="password" type="password" />
Confirm: <input ng-model="passwordConfirm" type="password" match="password" />

Object Property Example

Password: <input ng-model="user.password" type="password" />
Confirm: <input ng-model="user.passwordConfirm" type="password" match="user.password" />

Case insensitive (caseless) Example

Password: <input ng-model="user.password" type="password" />
Confirm: <input ng-model="user.passwordConfirm" type="password" match="user.password" match-caseless="true" />

match-caseless can accept a scoped variable to allow the matching to be toggle-able between case insensitive and case sensitive. Default: false

Not Match Example
Sometimes you want to ensure the values do not match, in that case you can use the not-match flag. This also works in combination with match-caseless (if you want to not match case insensitively).

Password: <input ng-model="user.password" type="password" />
Confirm: <input ng-model="user.passwordConfirm" type="password" match="user.password" not-match="true" />

not-match can accept a scoped variable (true/false) to be toggle-able between matching and not matching. Default: false

Ignore empty Example

Password: <input ng-model="user.password" type="password" />
Confirm: <input ng-model="user.passwordConfirm" type="password" match="user.password" match-ignore-empty="true" />

match-ignore-empty can accept a scoped variable to disable validating an empty input. Default: false

Display Custom Error
If your form and field both are named, you can access the validation result to show/hide messages.

<form name="myForm">
      Password: <input ng-model="user.password" type="password" name="passwordName" />
      Confirm: <input ng-model="user.passwordConfirm" type="password" match="user.password" name="myConfirmField" />
      <div ng-show="myForm.myConfirmField.$error.match">Fields do not match!</div>
</form>

Validate Against the $viewValue shown in the input
The internal value ($modelValue) can differ from the external value ($viewValue) as appears in the input field shown to the user. If your form and field both are named, you can validate against value displayed in the field, even if the field is invalid.

<form name="myForm">
    Password: <input ng-model="user.password" type="password" name="myPasswordField" />
    Confirm: <input ng-model="user.passwordConfirm" type="password" match="myForm.myPasswordField" name="myConfirmField" />
</form>

Note: $viewValues are specific to fields/elements, not models. Different fields with the same ngModel and have different $viewValues. Becuase of this, you need to use the form directive (assigning a name to a form tag) in combination with the specific field's name attribute to specific which field/element you want to match in particular.

Versions

Version
1.9.0
1.7.1
1.6.0
1.5.1