Check if Email Username Exists with CodeIgniter and jQuery Validation Plugin

by Josh | Posted in Scripts & Code Snippets | Tagged: , , ,

Username Already Exists - Codeigniter and jQuery

A common feature of most new user registration forms is a message telling you whether your chosen username or e-mail is already taken. The check is done through an AJAX request. Using the jQuery Validation plugin, the remote option can be used to request a URL that returns JSON data. Using Codeigniter, this URL is a new function in the controller used for registration. In this example, the register_email_exists() function returns true or false, after checking the entered form value against the database.

The PHP – For your Controller

Change the email_exists function to apply to your database. In this example, I have these functions in a controller called Registration, so the remote URL used in the jQuery is /registration/register_email_exists. Change that URL as necessary for your Codeigniter setup. I found that the json_encode function was necessary for the jQuery to receive the correct value.

The HTML – For your Form

Just make sure that the IDs match up with the validation options:

<input type="text" name="email1" id="email" />
<input type="text" name="email2" id="email2" />

The JavaScript – For jQuery Validation Plugin Options

This uses the bassistance.de jQuery Validation Plugin.

Recommended Books For Web Devs

CSS Secrets [Book Cover] Building out a design into HTML and CSS is like a series of small puzzles— some trickier than others. CSS Secrets: Better Solutions to Everyday Web Design Problems is a practical and modular look at many of the unique challenges you'll encounter during front-end development. Well-designed, and easy to pick up for any intermediate to advanced front-end dev looking to pick up some tips and tricks, and honing the processes used to figure them out.

Eloquent JavaScript [Book Cover] Eloquent JavaScript: A Modern Introduction to Programming is an engaging and well-formatted overview of JavaScript, complete with example projects and helpful diagrams. It's easy to read—not too dense, with readable type—and covers many subjects. The revised edition covers some of the newer features of JavaScript, including: class notation, arrow functions, iterators, async functions, template strings, and block scope.

The Phoenix Project [Book Cover] While The Phoenix Project: A Novel about IT, DevOps, and Helping Your Business Win is a fictional novel, the slightly exaggerated characters and situations involved will be very familiar to anyone working in software development and IT. In it, an IT manager is confronted with the seemingly impossible task of turning around a project that's over-budget and past deadlines in 90 days, or else his department will be outsourced. The morals and takeaways from this story about DevOps and lean principles will stick with you.

Comments on this Article

  1. | Link
    Robert says:

    Hello, thanks for the script, but i have a error, please help me:

    Message: is not allowed by Access-Control-Allow-Origin.

    Thanks again.

    • | Link
      Josh says:

      This is likely to do with accessing a remote URL, rather than one on the same domain for the AJAX request. Check into same-origin policy.

  2. | Link
    ipcastino says:

    hi. i used your script but i have a error using firebug in the console i got this error: POST http://localhost/myproject/index.php/validate_user/register_user_exists 404 not found

    thank you.

    • | Link
      ipcastino says:

      sorry for my bad english

    • | Link
      Josh Winn says:

      Sorry, I am not sure without looking at your code. If that controller action is going to a 404, that would likely be unrelated to this script.

    • | Link
      dean says:

      yes, the path to the file is wrong, so the code cannot pass the values to the file

  3. | Link
    alex says:

    if ( $this->email_exists($this->input->post(’email’)) == TRUE ) {
    echo json_encode(FALSE);
    } else {
    echo json_encode(TRUE);
    }

    must be

    if ( $this->email_exists($this->input->post(’email’)) == TRUE ) {
    echo ‘false’;
    } else {
    echo ‘true’;
    }

  4. | Link
    donny says:

    Hi guys,
    i’ve using my own way for remote validation, post data to backend success but i found email value is null even though i’ve write it down using
    ’email’: $(“input[name=email]”).val(),

    full code, i’ve using Csrf :
    rules: {
    email: {
    required: true,
    minlength: 3,
    maxlength: 100,
    email: true,
    remote: {
    url: “”,
    type: “post”,
    data: {
    ’email’: $(“input[name=email]”).val(),
    ‘second’: ‘test’,
    ‘config->item(‘csrf_token_name’); ?>’: ‘security->get_csrf_hash(); ?>’
    },
    success: function(e){
    console.log(e);
    },
    error: function(e){
    console.log(e);
    }
    }
    },

    and the result (browser console) :
    Object {email: “”, second: “test”}

    thanks before,

Comments are closed.