Plateforme Level Extreme
Abonnement
Profil corporatif
Produits & Services
Support
Légal
English
Validations of the input
Message
De
07/09/2017 12:57:32
 
 
Information générale
Forum:
AngularJS
Catégorie:
Codage, syntaxe et commandes
Divers
Thread ID:
01653867
Message ID:
01654093
Vues:
50
This message has been marked as a message which has helped to the initial question of the thread.
>Hi Viv,
>
>Do you know if the asyncValidators are always firing (regardless if the value is touched or not)?
>
>I'm debugging my code and it is firing when I just instantiate the form.
>
>Here is the directive now:
>
>
>(function (angular) {
>    "use strict";
>
>    var services,
>        $log;
>
>    angular.module("sysMgrApp").directive("smCodeUniqueValidator", ["ServiceLoader", smCodeUniqueValidator]);
>
>    /**
>     * smCodeUniqueValidator Directive
>     * @param {} serviceLoader 
>     * @returns {Object} 
>     */
>    function smCodeUniqueValidator(serviceLoader) {
>        services = serviceLoader;
>        $log = services.Log.getInstance("smCodeUniqueValidator");
>       
>        return {
>
>            require: "ngModel",
>
>            scope: {
>                primaryKey: "=?",
>                tableName: "@",
>                columnToTest: "@",
>                errorMessage: "=?"
>            },
>
>            link: function ($scope, element, attrs, ngModel) {
>
>                ngModel.$asyncValidators.smCodeUnique = function (modelValue, viewValue) {
>                    if (!viewValue) {
>                        return true;
>                    }
>
>                    let codeObject = {
>                        id: $scope.primaryKey, tableName: $scope.tableName,
>                        columnToTest: $scope.columnToTest, code: viewValue
>                    };
>                    return services.Http.put('api/items/checkCodeUniqueness', codeObject).then(
>                        function (response) {
>                            if (!response.data.isValid) {
>                                $scope.errorMessage = response.data.errorMessage;
>                                return services.Deferred.reject(response.data.errorMessage);
>                            }
>                            return true;
>                        }
>                    );
>                };
>            }
>        };
>    }
>})(angular);
>
>and this is the HTML - should I try adding ngModel.$touched condition at the very top?
>
>
><div class="col-xs-6">
>            <div class="controls">
>                <label class="control-label"
>                       ng-hide="editRetailTrackingForm.barcode.$dirty && editRetailTrackingForm.barcode.$error">
>                    @Labels.barcode:
>                </label>
>                <div ng-if="editRetailTrackingForm.barcode.$dirty">
>                    <div ng-messages="editRetailTrackingForm.barcode.$error">
>                        <div ng-message="maxlength">
>                            <label class="field-validation-error control-label-error animate-show">
>                                @String.Format(Messages.cannotExceed, Labels.barcode, "100")
>                            </label>
>                        </div>
>                        <div ng-message="smCodeUnique">
>                            <label class="field-validation-error control-label-error animate-show">
>                                {{itemBarcodeErrorMessage}}
>                            </label>
>                        </div>
>                    </div>
>                </div>
>                <div ng-class="{loading:editRetailTrackingForm.barcode.$pending}">@String.Format(Messages.validatingX, Labels.barcode)</div>
>                <input type="text" name="barcode"
>                       ng-model="currentItem.barcode"
>                       sm-code-unique-validator
>                       table-name="items"
>                       column-to-test="barcode"
>                       error-message="itemBarcodeErrorMessage"
>                       primary-key="currentItem.itemId"
>                       ng-model-options="{ debounce: { default : 500, blur: 0 }}"
>                       class="form-control"
>                       ng-maxlength="100" />
>
>            </div>
>        </div>
Looks like this might be known behaviour. See: https://stackoverflow.com/questions/31736496/why-does-adding-additional-angularjs-validation-directives-cause-asyncvalidator
and https://github.com/angular/angular.js/issues/14691

As suggested earlier there may be some condition that you can check in your directive to determine whether the asyncValidator actually needs to run. If it does not then you could just short-circuit the http call
Précédent
Suivant
Répondre
Fil
Voir

Click here to load this message in the networking platform