Check form field value against database value

JavaScript
1

I use the following (shorten version) function to validate and proccess a registration form:


  function submit_registration(){
      var reg           = /^([A-Za-z0-9_\\-\\.])+\\@([A-Za-z0-9_\\-\\.])+\\.([A-Za-z]{2,4})$/;
      var name          = $("#name").val();
      var email         = $("#email").val();

      if(name == "")
      {
            $("#send_status").html('<div class="error">Fill in your name to continue.</div>');
            $("#name").focus();
      }
      else if(email == "")
      {
            $("#send_status").html('<div class="error">Fill in your e-mail address to continue.</div>');
            $("#email").focus();
      }
      else if(reg.test(email) == false)
      {
            $("#send_status").html('<div class="error">This is not a valid e-mail address.</div>');
            $("#regemail").focus();
      }
      else
      {
            var dataString = 'name='+ name + '&email='+ email;
            $.ajax({
                  type: "POST",
                  url: "modules/site/process_registration.php",
                  data: dataString,
                  cache: false,
                  beforeSend: function()
                  {
                        $("#send_status").html('<div class="sending">Please wait...</div><br "class="clear">');
                  },
                  success: function(response)
                  {
                        $("#send_status").html($(response).fadeIn(2000));
                        $("#reg_form").fadeOut(1000);
                        $("#name").val('');
                        $("#email").val('');

                  }
            });
      }
}

What I need is a way to check if the given email address is already in the database. Is that possible within this function and if yes how? Or should I approach this in a different way?

Thank you in advance.

2

I’m assuming that you want to check for an unused email address before the form is submitted. In that case, doing anything from the submit_registration() function is not suitable.

You’ll want to attach an onchange event handler to the email field, and pass its value to a different php script to check if the email already exists.

3

Hi Paul. Thank you for your reply! That is indeed where I am after. So how should I do that?

4

There are a number of good resources that provide full details on how to do such things in regard to live checking username availability.

For emails, you would only need to change the username part of the examples to email, and instead of using onkeyup you would use the onchange event instead.

5

As a simple example, something like the following will be enough to get you going:


var form = $('#reg_form');
$('[name="email"]', form).on('change', function () {
    $.get( "checkemail.php", this.value, function() {
        // remove fail message
        // show success message
    })
    .fail(function() {
        // email already exists
        // show fail message
    });
});
6

Hi Paul. Thanks again for the reply. Your links and last script example are very very useful. I can work wit this :tup: