Question

I’m pretty new to programming and html design and would like to ask a question some might consider silly.

Here goes:

I have a registration form that is validated with jQuery validation plugin. Within this form, there is an email and password input which will be used as login credentials.

What I would like to do here is check whether this email is available in my database(MySQL). If it is, user will be prompted to insert another email. If it’s not, user goes ahead to claim that email. How do I go about doing this? Should I include a form within a form? For example, should I have an embedded form with a “Check availability” button like Gmail registration?

Is there a standard procedure to this? Please suggest a good and easy method.

Answer 1

You can use ajax for accessing a server side script for checking availability of email and then showing some notification/error message depending upon the response you get from server.

Like for example, on the blur event of email field (when it loses focus) you can fire off an event which has a call to a server side code using ajax and then depending upon the response, you can hide/show a particular which contains the error message.

Your email field might be like this…

<input type="text" name="email" class="email" />

jQuery code goes something like this…

$("input.email").blur( function() {
  $.ajax({
    url: 'ajax/getData.php?email=' + $(this).val(),
    success: function(data) {
      // Hide/show the error div over here
    }
  });
});