Удалить после заполнения всех обязательных полей в форме

Question

Как удалить отключенную кнопку отправки при заполнении всех обязательных полей с помощью JQuery. Вот мой HTML:

<form action="" method="post" class="my_form"> 
    <input type="text" class="form-control"> 

    <select class="form-control" required> 
     <option value="" disabled selected>Select</option> 
     <option value="Value 01">Value 01</option> 
     <option value="Value 02">Value 02</option> 
     <option value="Value 03">Value 03</option> 
     <option value="Value 04">Value 04</option> 
    </select> 

    <input type="text" class="form-control"> 

    <textarea class="form-control" rows="3" required></textarea> 

    <button type="button" data-dismiss="modal" disabled>Save</button> 
</form> 

Answer 1

Вы могли бы иметь на input и blur случае, проверяет наличие всех необходимых полей, когда что-то вводится в поле или фокус теряется.

Проверьте это fiddle. Должен дать вам представление о том, что я имею в виду.

Answer 2

использовать следующий подход с JQuery prop метода и метода Array.every:

$(".my_form :input[required]").on("change paste", function(){ 
    var requiredEls = $(".my_form :input[required]").toArray(), filled; 
    filled = requiredEls.every(function(v){ // ensure that all required fields are filled 
     return v.value.trim(); 
    }); 

    $(".my_form :button").prop('disabled', (filled)? false : true); 
});