Thursday 24 November 2016

Codeigniter Tutorial - Check Email availability using Ajax



This our one more tutorial in Codeigniter. In this tutorial we will discussing on how can we check email is available for registration or not by using Ajax with Jquery in Codeigniter framework. In most of the website registration we have use email for identify for login into system, then at that time we want to check particular email is already register into our system or not. So it is very important task to check email is already register or not at the time of registration. So In this video we have seen how can we validate email already registered or not in codeigniter application by using Ajax with Jquery. Here we have simple load register page from controller and then after on that view page we have write jquery code on textbox change event. So when we have enter email and go to password field then jquery code execute and in that code we have make ajax request and by using we have send request to controller and in controller first we have check email is proper or not if email is proper then it again check email is available in database or not so it go to model and in it will check email register or not and send result to controller and controller send result to view page. So This way whole cycle of codeigniter framework will run for checking email register or not by using Ajax with Jquery.



Source Code


Controller - main.php


 <?php  
 defined('BASEPATH') OR exit('No direct script access allowed');  
 class Main extends CI_Controller {  
      //functions  
      function email_availibility()  
      {  
           $data["title"] = "Codeigniter Tutorial - Check Email availibility using Ajax";  
           $this->load->view("email_availibility", $data);  
      }  
      function check_email_avalibility()  
      {  
           if(!filter_var($_POST["email"], FILTER_VALIDATE_EMAIL))  
           {  
                echo '<label class="text-danger"><span class="glyphicon glyphicon-remove"></span> Invalid Email</span></label>';  
           }  
           else  
           {  
                $this->load->model("main_model");  
                if($this->main_model->is_email_available($_POST["email"]))  
                {  
                     echo '<label class="text-danger"><span class="glyphicon glyphicon-remove"></span> Email Already register</label>';  
                }  
                else  
                {  
                     echo '<label class="text-success"><span class="glyphicon glyphicon-ok"></span> Email Available</label>';  
                }  
           }  
      }       
 }  
 ?>  

Models - main_model.php


 <?php  
 class Main_model extends CI_Model  
 {  
      function is_email_available($email)  
      {  
           $this->db->where('email', $email);  
           $query = $this->db->get("register");  
           if($query->num_rows() > 0)  
           {  
                return true;  
           }  
           else  
           {  
                return false;  
           }  
      }  
 }  
 ?>  

Views - email_availibility.php


 <!DOCTYPE html>  
 <html>  
 <head>  
      <title>Webslesson | <?php echo $title; ?></title>  
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />  
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>  
 </head>  
 <body>  
      <div class="container" style="width:600px">  
           <br /><br /><br />  
           <h3><?php echo $title; ?></h3>  
           <br />  
           <label>Enter Email</label>  
           <input type="text" name="email" id="email" class="form-control" />  
           <span id="email_result"></span>  
           <br /><br />  
           <label>Enter Password</label>  
           <input type="text" name="password" id="password" class="form-control" />  
      </div>  
 </body>  
 </html>  
 <script>  
 $(document).ready(function(){  
      $('#email').change(function(){  
           var email = $('#email').val();  
           if(email != '')  
           {  
                $.ajax({  
                     url:"<?php echo base_url(); ?>main/check_email_avalibility",  
                     method:"POST",  
                     data:{email:email},  
                     success:function(data){  
                          $('#email_result').html(data);  
                     }  
                });  
           }  
      });  
 });  
 </script>  

8 comments: