How do you disabled a button while a form doesn't validate with jQuery validate?

Question

Hello, I was wondering how you can disable button (not submit) with jQuery while a form doesn't validate with jQuery validate, but when it does validate, enabled the button.

Answer 1

$('#button').attr('disabled', 'disabled');
$("#myform").validate();
$("#submit").click(function() {
    if ($("#myform").valid())
        $('#button').removeAttr('disabled');
});

Answer 2

That's a little tricky to do. What I'd suggest trying is binding an change() event:

$(":input").change(function() {
  $('#formid").validate();
  if ($("#formid").valid()) {
    $("#buttonid").removeAttr("disabled");
  } else {
    $("#buttonid").attr("disabled", true);
  }
});

The weakness of this method is that, for example, if a text field can't be blank the change() event won't be fired until it loses focus so the button won't be ungreyed. If this is important to you you could add a keydown() event.