angular-async-validation

A multi purpose directive for input async validation

$3

This directive is designed to be reused several times depending on the purpose.
The directive can be used with other validation directives
There are two main ways to use it, the first is to use a string that points to the API to which you want to make the asynchronous request, the other is using a user-specified function.
``

html


When you use a string that point to a API service, like in the first example, remember that:
> If $http is used then it is important that the server returns a success HTTP response code in order to fulfill the validation and a status level of 4xx in order to reject the validation.
The ngModel directive is __required__ since the $asyncValidators are part of the __ngModel.NgModelController__ object.
For more info see the NgModelController page.
$3

Using the directive with a custom validation function specified in the controller.

html

javascript
// List of registered usernames
$scope.fullnames = ['Sandokan', 'Charlie Chaplin', 'Pippo Baudo', 'Sponge Bob'];
// The validation function
$scope.myValidation = function (modelValue, viewValue) {
    // Get the value
    var value = modelValue || viewValue;
    return $timeout(function () {
        // Check if is already taken
        if( $scope.fullnames.indexOf(value) > -1 ) {
            // Username exists, this means validation fails
            return $q.reject();
        } else {
            // Username does not exist, therefore this validation passes
            return $q.resolve();
        }
    }, 1250);

}`

Using a string that point to a API service.`html`If typed "__test__" will produce:GET /api/users/username/test.`html`If typed "__validate@mail.com__" will produce:GET /api/users/email/validate@mail.com`.

Than probably you want to check for the existence of that particular username/email in case of new registration to avoid duplicates or conflicts.

angular-async-validation

html

When you use a string that point to a API service, like in the first example, remember that:

> If $http is used then it is important that the server returns a success HTTP response code in order to fulfill the validation and a status level of 4xx in order to reject the validation.

The ngModel directive is __required__ since the $asyncValidators are part of the __ngModel.NgModelController__ object.

For more info see the NgModelController page.

$3

Using the directive with a custom validation function specified in the controller.

html

javascript
// List of registered usernames
$scope.fullnames = ['Sandokan', 'Charlie Chaplin', 'Pippo Baudo', 'Sponge Bob'];

// The validation function
$scope.myValidation = function (modelValue, viewValue) {

// Get the value
var value = modelValue || viewValue;

return $timeout(function () {

// Check if is already taken
if( $scope.fullnames.indexOf(value) > -1 ) {
// Username exists, this means validation fails
return $q.reject();
} else {
// Username does not exist, therefore this validation passes
return $q.resolve();
}

}, 1250);

Using a string that point to a API service.

html


If typed "__test__" will produce:

GET /api/users/username/test

html


If typed "__validate@mail.com__" will produce:

GET /api/users/email/validate@mail.com`.

Than probably you want to check for the existence of that particular username/email in case of new registration to avoid duplicates or conflicts.