Home Forums Front-end Issues ACF field JS validation before submit


ACF field JS validation before submit

  • I couldn’t find a clean way to custom validate a field with JS before the submit actually happens.

    I have a field for which I want to apply custom front-end validation (a button group whose value must be “yes” to allow form submission).

    I’ve added an event to the form submit. If the field value is not “yes”, I cancel the event. Great… except the spinner activated by the submit button keeps spinning. Not very user friendly.

    Here’s the code :

    jQuery("form").submit(function(evt) {
        if (document.getElementsByName("acf[field_5c4e7252627ab]")[1].checked) {
        } else {
            console.log("NOT CHECKED");

    Is there a way to properly add JS custom validation ? I’ve read the ACF doc about the JS API but couldn’t find something really helpful there.

    Thanks for you help.

  • I don’t know if this is possible or not. I don’t see anything in the JS API about this but then there are probably hooks that haven’t been documented yet if you dig around in the code.

    This could be handled by adding a custom validation filter for this field without using JS

  • Ok, as my page is JS intensive, I was looking for a JS solution. Obviously, I looked at the wrong place. I did what you suggested and it works. Thanks!

    Now, this being said, it might be useful to have a way to do this via a JS hook.


Viewing 3 posts - 1 through 3 (of 3 total)

The topic ‘ACF field JS validation before submit’ is closed to new replies.