How to trigger a function when input type email is valid?

Question

I have a HTML form with an input type="email" in it. This field will accept only when the input mathes with a valid email pattern.

I want to make an AJAX request to the server making sure that the email does not exists in the database after the entered email has been verified by the input field. For this I tried .valid() function on the field hoping that it will be triggered when a valid email is entered, as :valid is the CSS pseudo class.

$("input[type='email']").valid(function() {
    let email = $("input[type='email']").val();
    if(email != null) {
        $.ajax({
            // Ajax request made here..
        })
    }
}

But I am getting error that valid method does not exists. How else can I achieve this?

Edit: My question is not about verifying whether the email is in correct format or not as described in this question. It is about running a function which makes an AJAX call only if the entered email is already in valid format. The AJAX call checks whether the email is already linked with another account or not. I could make this function on focusout, but this will make unnecessary calls to the server when the email is clearly invalid.

please, check https://stackoverflow.com/questions/46155/how-to-validate-an-email-address-in-javascript?rq=1 — Héctor Prats, Jul 11 '19 at 07:44
Possible duplicate of [How to validate an email address in JavaScript?](https://stackoverflow.com/questions/46155/how-to-validate-an-email-address-in-javascript) — Wimanicesir, Jul 11 '19 at 07:46

score 2 · Accepted Answer · answered Jul 11 '19 at 08:15

2

you can check if the email is valid every time the user change the value of the input :

$("input[type='email']").keyup(function() {
    let email = $("input[type='email']").val();
    if($(this).is(':valid')) {
        $.ajax({
            // Ajax request made here..
        })
    }
}

answered Jul 11 '19 at 08:15

Mustapha Larhrouch

3,373
3
14
28

$(this).is(':valid')) was what I was looking for. Thanks! – YeetCoder Jul 11 '19 at 08:18

How to trigger a function when input type email is valid?

1 Answers1