CODEWITHSUNDEEP
cssangularjs
dnyanesh
dnyanesh

Reputation: 99

CSS - Apply css rule if two css classes are present with other css classes

I have form with input fields. The classes which are applied to input field are changed on click of submit button. I want to apply css rule if two css classes are applied with other css classes

Ex.

<input ng-model="formField.val" type="text" name="103" 
       class="form-control ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required" 
       ng-disabled="readOnlyFlag" required="">

on click of submit button, the new css classes ng-invalid & ng-touched are applied with other css classes. I want apply css rule if ng-invalid & ng-touched are applied with other css classes.

 <input ng-model="formField.val" type="text" name="103" 
       class="form-control ng-pristine ng-empty ng-invalid ng-invalid-required ng-touched ng-invalid ng-invalid-required" 
       ng-disabled="readOnlyFlag" required="">

Upvotes: 0

Views: 90

Answers (1)

Ralf de Kleine
Ralf de Kleine

Reputation: 11744

Add styling for input when it has two classes:

input.ng-invalid.ng-touched{
  background:red;
  color:red;
}

Or if you want to use code use hasClass :

angular.element(myElement).hasClass('my-class');
angular.element(myElement).addClass('new-class');
angular.element(myElement).removeClass('old-class');

Code is copied from this question.

Upvotes: 2

Related Questions