Say I have an online form, and I want to figure out whether a user is entering an email that's already in use by the system. Can I tell the system to check the field against the database as soon as the user moves their cursor / selection away from the field? Could anyone point me in the right direction if this is actually possible?

Say I have an online form, and I want to figure out whether a user is entering an email that's already in use by the system. Can I tell the system to check the field against the database as soon as the user moves their cursor / selection away from the field? Could anyone point me in the right direction if this is actually possible?

• javascript
• ajax

Share Improve this question Follow asked May 13, 2016 at 17:05 114114 92633 gold badges2727 silver badges5555 bronze badges 1

• Yes. You can use onblur event handler, and ajax to send/receive data without page refreshing... – sinisake Commented May 13, 2016 at 17:09

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 4

You could attach a listener to the text field using jQuery's blur event, like so:

$('#MyEmailField').blur(function() {
  // jQuery AJAX Call here, $.ajax(...)
})

For this You need to call ajax when user writing an email id means on blur event as below :

    $('#yourfieldID').blur(function() {
       var val = $(this).val();
       $.ajax({
                type: 'POST',
                url: 'your url',
                data: {email: val},
                success: function (data) {
                    // check for response
                    });
                }
            });
    });

Now In file which you called in ajax url, Your need to check data which is exist in database or not and according to that you need to send response and check it in sucess part of ajax call.

I hope you will get it.

Yes, it is possible using an AJAX call on the "onblur" event of Javascript (or "focusout" method of jQuery)

You could use something like this, in the HTML:

<input type="email" name="myinput" />

And the JS:

$( "input" ).focusout(function() {
    var usr_email = $(this).value;
    $.ajax({
       method: "GET",
       url: "some.php",
       data: { email: usr_email }
    }).done(function( response ) {
       if(response == "taken"){
         $("input").borderColor = "red";
       }
    });
}

You can check for email's availability through an Ajax call in database on text change or blur event of email textbox. Then notify the user accordingly.

As soon as user moves out of email field, say tab or mouse click, you need to trigger a function to make a Ajax call to your server. The triggering function would be onBlur of email field. Then check If user email exits, get back Ajax response to notify the user.