Form validation Field css Classes

Need Help
#1

Hi, is there any event to check if a form field is valid like for this non valid form

addEventListener('ajax:invalid-field', function(event) {
    const { element, fieldName, errorMsg, isFirst } = event.detail;
    element.classList.add('has-error');
});
#2

Hi @ibrarartisan,

I’m not quite sure what you’re referring to (I also noticed your post “Validation without Submitting”).

  1. Before the user clicks the button: This would need to be handled through JavaScript, such as on keyboard events.
  2. When the button is clicked before sending the request: Browser-based validation will run before the form is submitted if specified. You can use data-browser-validate (see docs) or the JavaScript API method browserValidate (see docs).
  3. When the request is sent: You can validate the inputs on the server, ensuring they meet the requirements, and return an exception if they don’t.
#3

@apinard thanks for the explanaition.

I mean:

This code snippet is working after the return from validatior. In case the field is validated and not good then it adds the desired class. However if the field is validated and is good then i want to add some class to the field.