validate class enhacement

  1. MDB Home Page
  2. Support Main Page
  3. General Bootstrap questions
Topic: validate class enhacement

psarmaputra7 pro asked 7 years ago

how can i achieve something like this https://i.imgur.com/829RUjC.png

Jakub Strebeyko staff answered 7 years ago

Hi there psarmaputra7,

Thanks for reaching out! To achieve the mentioned effect, you could, for example, consider creating a blur event listener on <input>, that would be checking whether it has .valid /.invalid class after validation, and it so, it would be changing color properties of previously cashed elements. It could look something like that:

$(document).ready(function() {
  var icon =$('#icon');
  var input =$("#form2");
  input.blur(function(){
    if (input.hasClass('valid')) {
      icon.css('color', '#4285F4')
    } else if (input.hasClass('invalid')) {
      icon.css('color', 'red')
    }
  })
});

Hope it helps you find what you are looking for.

With Best Regards,
Kuba

Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: Yes
About author
psarmaputra7
Pro User
10Support score
2Questions 1Answers
0Snippets likes 0Snippets