add class when input is valid in angularjs

» javascript » add class when input is valid in angularjs

By : Sonnet

Date : November 29 2020, 09:01 AM

fixed the issue. Will look into that further The $valid and $invalid properties come from the form and not from the value of the input. You need a form element with a name, then also a name into the input, and then use formName.inputName.$valid or $invalid.

code :

Share :

AngularJS: How do I manually set input to $valid in controller?

By : 김영민

Date : March 29 2020, 07:55 AM

I wish this help you You cannot directly change a form's validity. If all the descendant inputs are valid, the form is valid, if not, then it is not.
What you should do is to set the validity of the input element. Like so;

code :

addItem.capabilities.$setValidity("youAreFat", false);

addItem.capabilities.errors.youAreFat == true;

angularjs - ng-dirty class on input type number / $valid is true when entering text

By : vinesh maurya

Date : March 29 2020, 07:55 AM

help you fix your problem It's browser "bug"(it's actually expected behaviour) see https://github.com/angular/angular.js/issues/2144 there are some workarounds, such as this https://groups.google.com/forum/#!topic/angular/pRc5pu3bWQ0/discussion
or you could write your own input directive using the same principles

code :

app.directive('input', [function() {
    return {
        restrict: 'E',
        require: '?ngModel',
        link: function(scope, el, attrs, ctrl) {
            if (attrs.type == 'number' && typeof el.prop('validity') !== 'undefined') {
                el.on('keyup change', function() {
                    var validity = el.prop('validity');
                    ctrl.$setValidity('badInput', !validity.badInput);                      
                });
            }
        }
    };
}]);

AngularJS input watch $valid or $error

By : user3439145

Date : March 29 2020, 07:55 AM

may help you . I don't see any reason why your first variant shouldn't work.
HTML:

code :

<div ng-app="myApp">
    <div data-ng-controller="MainController">
        <form name="myForm"> 
            <input name="myInput" ng-model="myInputMdl" business-validation />
        </form>
    </div>
</div>

var myApp = angular.module('myApp', []);

myApp.controller('MainController', function ($scope) {
    $scope.$watch('myForm.myInput.$valid', function (validity) {
        console.log('valid', validity);
    });
});

myApp.directive('businessValidation', function () {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function (scope, elem, attr, ctrl) {
            function validate (input) {
                return input === 'hello';
            }

            ctrl.$parsers.unshift(function (value) {
                var valid = validate(value);
                ctrl.$setValidity('businessValidation', valid);
                return valid ? value : undefined;
            });

            ctrl.$formatters.unshift(function (value) {
                ctrl.$setValidity('businessValidation', validate(value));
                return value;
            });
        }
    };
});

AngularJS input $valid is always false with no error

By : Nontombie

Date : March 29 2020, 07:55 AM

it fixes the issue I'm trying to apply an AngularJs validation in my project. So the following code was written: , I had the same issue. It works if you use the $scope:

code :

<span>valid = {ng $scope.recipeTitle.name.$valid ng}</span>
<span>errors = {ng $scope.recipeTitle.name.$error ng}</span>

<span>valid = {ng recipeTitle.name.$valid ng}</span>
<span>errors = {ng recipeTitle.name.$error ng}</span>

AngularJS Input valid if value is in array

By : erik harlert

Date : March 29 2020, 07:55 AM

I wish this help you Check Angular-UI's project which includes ui-validate/ui-validate-async directives.
This directives makes it very easy to create custom validator expressions. In your case it can look like ui-validate="{inArray: 'isInMyArray($value)' }".