How to change the styleName for the textfield based on the condition

Hi everyone,

I have a textfields called password and email. And I used the validators  as follows

final PasswordField password = new PasswordField("PASSWORD");
        password.setStyleName("errorResolverSearch");
        password.addValidator(new PasswordValidator());
        password.setRequired(true);

final TextField email = new TextField ("E-MAIL");
        email.setStyleName("errorResolverSearch");
        email.setInputPrompt("e-mail");
        email.setRequired(true);
        email.addValidator(new EmailValidator(
                "Invalid Email address {0}"));
        email.setInvalidAllowed(false);

And I want to change the outline of the textfield boxes based on the condition in this way:

if(!email.isValid())
        
                {
                    email.removeStyleName("errorResolverSearch");
                    email.addStyleName("errorUserManagement");
                    email.setValue(" ");
                    System.out.println("The email is not valid");
                    
                }

if(!password.isValid())
                {
                    password.removeStyleName("errorResolverSearch");
                    password.addStyleName("errorUserManagement");
                    password.setValue(" ");
                    
                    
                    System.out.println("The password is not valid!!!");
                }

The css for the textfields are:

.v-textfield-errorUserManagement  
{
 
    outline: 1px solid rgb(256, 0, 0);
    border-radius:0px !important;
    box-shadow: -1px -1px 5px #c0c0c0;
    width: 160px;
}

.v-textfield-errorResolverSearch {
    border-radius:0px !important;
    box-shadow: -1px -1px 5px #c0c0c0;
    width: 160px;
}
And when I run the program, only the email textfiled has the red colored line. I want both text fileds to have red border when the invalid value is inputed

Hi,

is there a reason you're not targeting the CSS error class v-textfield-error that's been generated by the framework? That way you wouldn't need to add and remove class names in your own code and just leave stylings to the style sheet.

-Olli