Hello Reader's, If you are developing the website in codeigniter and want to make login via ajax, then you have to use use ajax with PHP in website functionality. Ajax give you a lot of functions by which speed of website will increase. In this blog we will see how to make ajax login using Codeigniter framework. So lets get started working on it.
Step1:- Create a simple HTML page with login form and two text boxes, 1. Username 2. Password. It's code will go like this
<html>
<body>
<form class="form-signin border-radius" name="login" id="login" >
<center class="error"> </center>
<div class="form-group">
<label>Enter Email</label>
<input type="text" id="inputEmail" name="userEmail" class="form-control valid" value="asdfsdf@sdds.com" placeholder="" required="" autofocus="">
</div>
<div class="form-group">
<label>Password</label>
<input type="password" id="inputPassword" name="userPassword" value="12345678" class="form-control" placeholder="" required="">
</div>
<div>
<label class="checkbox">
<input class="cust-checkbox" checked="" name="remembercheck" value="1" type="checkbox">
Remember me
</label>
<input type="submit" id = "Login" value="Login" class="btn btn-primary">
</div>
</form>
</body>
</html>
Step2: Now below this html code we will write the ajax code which will send data to validation page on Controller.And it will go like this:-
<script type="text/javascript">
$("#Login").click(function(){
var username = $("#username").val();
var password = $("#password").val();
$.ajax({
type: "POST",
url: webUrl+'User/checkLogin',
data: ({username: username, password : password }),
});
});
</script>
In the above javascript code we have initiate a click event by clicking login button. After clicking this ajax is sending the username and password to user controller's checklogin function. Now we will check and validate these username and password on user controller.
Step3: Create a new function with name checkLogin inside the user controller and get the details sent via POST. Its code will go like this:-
function checkLogin()
{
$data['userEmail'] = $this->input->post('userEmail');
$data['userPassword'] = md5($this->input->post('userPassword'));
if(isset($_POST['remembercheck']) && $_POST['remembercheck'] == 1){
setcookie("findnerd", $data['userEmail'], time()+(60*60*24*30),'/');
setcookie("findnerdpassword", $this->input->post('userPassword'), time()+(60*60*24*30),'/');
setcookie("findnerd", '1', time()+(60*60*24*30),'/');
}elseif(isset($_COOKIE['findnerdemail']) && $_COOKIE['tajerleeemail'] == $data['userEmail']){
setcookie("findnerdemail", '', time()-(60*60),'/');
setcookie("findnerdpassword", '', time()-(60*60),'/');
}
$this->usermodel->SignIn($data);
}
Step 4: Create a new model function inside the usermodel and name it to SignIn(). This is fetch and match the records respect to sent username and password. And it's code will go like this:-
public function SignIn($data)
{
$this->db->select('*');
$this->db->from('user_registrations');
$this->db->where('email', $data['userEmail'] );
$this->db->where('password', $data['userPassword']);
$query = $this -> db -> get();
$result = $query->row_array();
if($query->num_rows()>0){
if($result['verified'] == "0")
{
$this ->session->set_flashdata('msg', $this->lang->line('Please enter the Activation code and you can also check on your registered mobile number') );
$userTempData = array('id'=>$result['id'],'code' => $result['token'], 'email' => $result['email'], 'password' => $result['password']);
$this->session->set_userdata('userAccountActivation', $userTempData);
print_r( $userTempData);
}else if($result['status'] == "0"){
$this ->session->set_flashdata('msg', $this->lang->line('Your Account has been suspended by admin'));
echo "Account suspended by admin";
}else{
echo "Wrong username/password";
}
}
Step4: This is the final step where you will get the message if user have valid details. This is just the javascript code which you can tell user in each case.
Case 1 if this is a valid detail this you will get an array in which you will get username, userid and user phone.
Case2 if account is blocked by admin then you will get a message showing "Your account is suspended by admin"
Case3 if username/password is incorrect then you get a message showing "Incorrect username password".
So you just need to put this message on the same and this thing done by ajax so your page will not reload and all the other process will operate in backend.
the last script which you need to add at bottom is as below:-
<script>
success: function(data) {
console.log(data);
}
<script>
0 Comment(s)