Keep button disabled if text is not entered

Question

I want to achieve something like this. I have 4 text fields and one select field that are required for the form to submit. I want to keep the button disabled unless the text field has values and an option is selected from the dropdown. My code is here

The problem I have is whenever I enter the data in the 4 text fields and though the dropdown is selected to the default text the button gets enabled. After I change the dropdown it is disabled forever.

Answer 1

Try this - DEMO

$('#fname, #lname, #zipcode').on("keyup", action);
$('#location').on("change", action);

function action() {
    if( $('#fname').val().length > 0 && $('#lname').val().length > 0 && $('#zipcode').val().length > 0 && $('#location').val() != '' ) {
        $('#submit').prop("disabled", false);
    } else {
        $('#submit').prop("disabled", true);
    }   
}