0

I'm trying to disable a submit button to check if all the input fields are filled before submitting. I've checked and used most of the codes here. I have found a handful that works, but the problem is the code works when I check it on a console window, but it doesn't work when I include it on a WordPress site. I'm using Skyboot Custom Script Panel and i have put the script after the footer.

Here is the code:


    var $ = jQuery.noConflict();

    $(document).ready(function() {
      $('button').attr('disabled', true);
      $('input').on('keyup blur', function() {
        if ($('[data-wof-field~="primary_email"]').val() != '' && $('[data-wof-field~="text_2"]').val() != '' && $('[data-wof-field~="number_1"]').val() != '' && $('[data-wof-field~="text_1"]').val() != '') {
          $('button').attr('disabled', false);
        } else {
          $('button').attr('disabled', true);
        }
      });
    });

Thanks in advance,

Barmar
  • 741,623
  • 53
  • 500
  • 612
Richu
  • 13
  • 5
  • Why don't you just put `required` in all the input fields? Then the browser won't let you submit the form. – Barmar Aug 12 '21 at 21:14
  • The reason I want use a script is, because I don't want the user to click the button without filling the form. Because I have another event listener waiting to be triggered when the button is clicked. – Richu Aug 13 '21 at 05:51
  • This normally works (see https://stackoverflow.com/questions/13626517/how-to-remove-disabled-attribute-using-jquery). If it's not, it seems like WordPress may be doing something that interferes. – Barmar Aug 13 '21 at 13:42
  • Is there a way I can check which part of WordPress is causing the issue? Because some of the jQuery snippets are working, it is only the On function having trouble. – Richu Aug 13 '21 at 17:18
  • If you add `console.log` to the event listener, do you see it running? – Barmar Aug 13 '21 at 18:33

0 Answers0