Check during typing in jquery, not after blur

Question

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.

Use both `onKeyPress()` and `onKeyUp()` as shown in this answer: http://stackoverflow.com/questions/11365686/how-to-get-text-of-an-input-text-box-during-onkeypress/11365810#11365810 — Jonathan M, Jul 28 '12 at 01:26

The Alpha · Accepted Answer · 2012-07-28T01:29:00.650

1

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.

edited Jul 28 '12 at 01:29

answered Jul 28 '12 at 01:15

The Alpha

143,660
29
287
307

Thank you Sheikh Heera, unfortunately it doesn't unlock the submit. actually it does, however if I won't type the address manually (but start typing then select it from tip down list of previous entries) it doesnt unlock the submit. what could be a reason? – Piotr Ciszewski Jul 28 '12 at 01:22
Then don't delete your `.change()` handler. – darksky Jul 28 '12 at 01:24
I don't fully understand. I can't use both .change and .keyup, can I? – Piotr Ciszewski Jul 28 '12 at 01:27
It's well done Sheikh Heera, but if you start typing and then the small dropdown with hints appear and you select any of them (previously stored emails in memory) - you won't be able to press the submit. it is working only when the last character is manually typed by you. do you know what I mean? it is also visible in the example you sent. – Piotr Ciszewski Jul 28 '12 at 02:10
Try ``, check [this](http://jsfiddle.net/v73vz/1/). – The Alpha Jul 28 '12 at 02:13

Check during typing in jquery, not after blur

1 Answers1