Change event to check change on any form element

1.1k views Asked by At

I have a from with disabled button, which gets enabled when the form is valid. With the function below I'm checking for changes and it works if the form consists only of inputs. How can I check for change on other elements like select or checkbox?

$("#create-rule-form").parsley();
$('input').on('keyup', function() {
  $("#create-rule-form").parsley().validate();
  if ($("#create-rule-form").parsley().isValid()) {
    $('#create-rule-btn').prop('disabled', false);
  } else {
    $('#create-rule-btn').prop('disabled', 'disabled');
  }
});

2

There are 2 answers

2
Barmar On BEST ANSWER

Use jQuery's :input selector, it matches all tags that are used for form input.

$(":input").on('edit change').function() {
  // code here
});
1
Anis R. On

You can use $('form').find('*') to select all of the form's children and grandchildren, and then apply the event to all of them like below.

Also, on a side note, I believe the event you should handle is change instead of keyup, as keyup will not work with checkboxes and dropdowns.

$('form').find('*').on('change', function() {
  //do stuff
});