Codeigniter Tutorial: How To check Username/Email availablity using jQuery in Codeigniter?
ZeeShaN 
This post is for CI lover who wants to learn Codeigniter. This script will show you how can we check live availability of username or email using Ajax in Codeigniter. Using this tutorial you can also understand how can we send a jQuery Ajax request to server living in CI.
In your view where you have created form include jQuery library and put the below code there.
In header section:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | $(document).ready(function() {
/// make loader hidden in start
$('#Loading').hide();
$('#email').blur(function(){
var a = $("#email").val();
var filter = /^[a-zA-Z0-9]+[a-zA-Z0-9_.-]+[a-zA-Z0-9_-]+@[a-zA-Z0-9]+[a-zA-Z0-9.-]+[a-zA-Z0-9]+.[a-z]{2,4}$/;
// check if email is valid
if(filter.test(a)){
// show loader
$('#Loading').show();
$.post("<?php echo base_url()?>controller_name/check_email_availablity", {
email: $('#email').val()
}, function(response){
//#emailInfo is a span which will show you message
$('#Loading').hide();
setTimeout("finishAjax('Loading', '"+escape(response)+"')", 400);
});
return false;
}
});
function finishAjax(id, response){
$('#'+id).html(unescape(response));
$('#'+id).fadeIn();
} |
In body section in your form:
1 2 3 4 5 | <div> <label>E-mail</label> <input id="email" name="email" type="text" value="" /> <span id="Loading"><img src="loader.gif" alt="Ajax Indicator" /></span> </div> |
In Your controller add this function:
1 2 3 4 5 6 7 8 9 10 | function check_email_availablity() { $this->load->model('My_model'); $get_result = $this->My_model->check_email_availablity(); if(!$get_result ) echo '<span style="color:#f00">Email already in use. </span>'; else echo '<span style="color:#0c0">Email Available</span>'; } |
Suppose you have a model called my_model.php and a table tbl_members or what ever you named. This table should have a field named “email” of type varchar [200].
Add this function:
1 2 3 4 5 6 7 8 9 10 11 12 | function check_email_availablity() { $email = trim($this->input->post('email')); $email = strtolower($email); $query = $this->db->query('SELECT * FROM tbl_members where email="'.$email.'"'); if($query->num_rows() > 0) return false; else return true; } |
Thats it, this function will return a message against email field that whether it is available or not. This is not for only email, you can use it to check any field. Also this is client side check so you also need to use this model function in server side so that email can also be verified when form has been submitted with disabling javascript .
Who I Am
Zeeshan Rasool
Software Engineer - PHP
Lahore - Pakistan
zeeshan(@)99points.info
Skype: zeeshan-rasool
gTalk: zishan.rasool85
Categories
- AJAX (37)
- Codeigniter (16)
- CSS (16)
- Facebook (11)
- Joomla (1)
- JQuery (53)
- Miscellaneous (4)
- Mootools (1)
- MySQL (6)
- PHP (60)
- SEO (2)
- Technology (6)
- Tutorials (15)
- Twitter (2)
- Web Design (23)
- Web Development (57)
- WordPress (2)
Tags
Comments
- ZeeShaN on Facebook Wall Script Clone with JQuery and PHP: Personal Project BETA Version 2.0
- 20 + Fresh jQuery Image Gallery/Slider Plugins and Tutorials Worth a Look | free on JQuery Based Flipped Image Gallery with Bounce Effects
- 20 + Fresh jQuery Image Gallery/Slider Plugins and Tutorials Worth a Look | free on Fresh JQuery Image Gallery with Captions and Auto Play/Pause Rotation
- 25 Cool and Helpful jQuery Plugins/Tutorials For Your Next Project | free on jQuery Tutorial: Create jQuery and CSS based Awesome navigation.
- 25 Cool and Helpful jQuery Plugins/Tutorials For Your Next Project | free on Ajax Tutorial: How to Create Ajax Search Using PHP jQuery and MYSQL
CI handles SQL and XSS attacks by itself already, also, I wouldn’t use a model in this case.
It’d be rather useful if your function (CI one), would respond with a JSON status and highlight e-mail field depending on it’s response, or disabling the submit button if it’s in use.
Besides that, I love the fact you’re promoting CI and Jquery! Those two go very well together!
[...] How to check username/email availability with jQuery in CI: http://www.99points.info/2010/07/codeigniter-tutorial-check-usernameemail-availablity-using-jquer-in... [...]
hi Zeeshan…..
i am web developer. Fresher in industry. recently working on php project . i have one project our team decided to use codeigniter in that….
until now i develop application withuot using mvc ..
it is helpful to develop application with codeigniter….
if you have any information site please help me…
Reply soon
[...] Vielzahl von Tutorials zu CodeIgniter mit jeweils sehr interessanten Themen, unbedingt reinschauen.How To check Username/Email availablity using jQuery in CodeIgniter? Upload and Convert video to FLV using FFmpeg. Simple class to encrypt url data How to Create Ajax [...]
Hi
You should catch value from controller and then pass model.
to be suggestion.
Dude nice article, although i wonder why your doing this in this manner as you should know CI can do this for you without writing more than a line of code….. ??
‘v’ like
hi this is not working ..
[...] Codeigniter Tutorial: How To check Username/Email availablity using jQuery in Codeigniter? [...]
@Al, I agreed with you Al
I use these things after keeping all security points in my mind. SQL injection and XSS attacks can also be controlled thru global config variable. If we use active class library of CI to interact with db then sql injection can be eliminated.
I just tried to explain a simple way to CI developers that how can we make it happen, while these things comes under security issues and one day I will write a tutorial on implementing CI security in a project and I would also keep this point in my mind when ever I will write next tutorial so that I can keep you people in peace
Cheers,
Zee