Problem with async validators

[zoomisen]

I'm trying to use an async validator combined with your module, my api return a 200 response if email is unique and a 400 response if it's already in use.

Have you tried using async validators?

I think your module needs some way to notice if validity has changed after an async validator has been deferred.

Or do you have an working example.

The field am testing with looks like this:

<div class="form-group">
        <label for="email">E-mail</label>
        <div class="input-group">
                <div class="input-group-addon"><i class="fa fa-envelope"></i></div>
                <input ng-model="admin.email" id="email" name="email" class="form-control" type="email" required is-unique-admin-email ng-model-options="{debounce: 250}" />
        </div>
</div>

ctrl.$asyncValidators.uniqueAdminEmail = function(modelValue, viewValue)
{
    return $http({
        url: "/validate/unique-admin-email?email=" + value,
        method: "GET",
    })
        .then(function()
        {
            return $q.resolve();
        }, function()
        {
            return $q.reject();
        });
};

[sagrawal31]

I'll take a look @zoomisen

[ShaneYu]

After I've finished my changes for feature #24, I am happy to take a look at this one too. But I must say that you would be better off returning a http status of 200 with true meaning it is okay to use and false if not. 400 is a bad request, indicating that what was entered into the request is invalid, but even if the email is already in use, that doesn't make the request invalid. I will look at it as though it is staying as returning 400 or 200.

Out of interest, is this still an issue for you @zoomisen, or have you found a solution now?

[ShaneYu]

@zoomisen: I just noticed and improvement you may like to consider adding to your validator also. prior to making the HTTP call, you may want to check if the modelValue is undefined or empty, if it is, just resolve it. Otherwise when the field is blank, it will still check if the email is unqiue....if it is blank you want it to just think it is valid to prevent the error from showing when it really ought not to; if that makes sense and I've not waffled.

ctrl.$asyncValidators.uniqueAdminEmail = function(modelValue, viewValue) {
        if (!angular.isDefined(modelValue) || modelValue.length === 0) {
                return $q.resolve(); // Consider empty model as valid
        }

    return $http({
        url: "/validate/unique-admin-email?email=" + value,
        method: "GET",
    }).then(function() {
                return $q.resolve();
    }, function() {
        return $q.reject();
    });
};

[sagrawal31]

@zoomisen I can reproduce this issue. I'll fix this. @ShaneYu thanks for pitching in!

[Aduer]

I managed to make this library working also with asyncValidators by replacing the watch block @ line 132 in file validation.directive.js (just below the comment

TODO: Find alternative to this watch

with this two watches that takes into account also the $pending property

 $scope.$watch(function () {
            return ngModelController.$error;
        }, function(newValue, oldValue){
            displayOrHideValidationState();
        }, true);

        $scope.$watch(function () {
            return ngModelController.$pending;
        }, function(newValue, oldValue){
            displayOrHideValidationState();
        }, true);