jqueryform-submitsubmitchangesdisabled-control

Check during typing in jquery, not after blur


I have a small problem that is probably easy to fix, but I'm not that good yet. I have written this simple code

$(document).ready(function(){
    $('#email').change(function(){
        var regexp = /^\w+[@]\w+\.\w{2,4}$/;
        if(regexp.test($(this).val())){
            document.getElementById("submit").disabled = false;
        }
    });
});

It checks is email valid in form, then if it is - it enables the SUBMIT button. The problem is that it validates the email after I click anywhere else, NOT during typing. So basically I have to click somewhere outside the email field and then I can click SUBMIT. If I will type a proper email and won't click anywhere outside this field it won't unlock the SUBMIT. What should I change here? Any ideas? I kindly appreciate all answers. Thank you in advance.


Solution

  • Try using

    $('#email').keyup(function(){
        var regexp = /^\w+[@]\w+\.\w{2,4}$/;
        if(regexp.test($(this).val())){
            $("#submit").prop('disabled', false);
        }
        else $("#submit").prop('disabled', true);
    });
    

    or

    $('#email').on('keyup', function(){
        var regexp = /^\w+[@]\w+\.\w{2,4}$/;
        if(regexp.test($(this).val())){
            $("#submit").prop('disabled', false);
        }
        else $("#submit").prop('disabled', true);
    });
    

    Working Example.