How to Remove invalid exclamation part validation for password and reconfirm password?

user_17568895 0
Viewed 60

Hi i got this problem as you can see when the user didn't type in anything the validation appear when button is click however the exclamation part is blocking my toggle password view is there a way where i can remove the exclamation mark i try this css is not working ?

Here the image below enter image description here

This is the css style

.form-control.is-valid, .pass, .confirmpass:invalid{
            background-image: none ;
  }

This is the form html for the password

                                <div class="form-group row">
                                <label for="validationpassword" class="col-form-label passwordadduser">*Password:</label>
                                <div class="col-6 d-flex">
                                <input name="validationpassword" onChange="onChange()" type="password" class="form-control pass" id="password" placeholder="Password"  required>
                                <i class="bi bi-eye-slash" id="togglePassword"></i>

                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="validationconfirmpassword" class="col-form-label passwordadduser">*Re-enter<br>&#10;Password:</label>
                                <div class="col-6 d-flex">
                                <input name="validationconfirmpassword" onChange="onChange()" type="password" class="form-control confirmpass" id="confirm_password" placeholder="Confirm Password" required>
                                <i class="bi bi-eye-slash" id="toggleconfirmPassword"></i>
                                </div>
                            </div>
validation css html
1 Answers

Try removing the required attribute to the inputs, since you have specified that they should be filled

Also, you need to add !important to your CSS:

.form-control.is-valid, .pass, .confirmpass:invalid{
            background-image: none !important;
  }
user_132590600
Related