Cara Membuat Form Login CodeIgniter, Mysql dan Bootsrap

Untuk membuat Form Login  Codeigniter yang perlu di buat yaitu database terlebih dahulu, karena tutorial disini hanya membuat Form Login mak...

Untuk membuat Form Login  Codeigniter yang perlu di buat yaitu database terlebih dahulu, karena tutorial disini hanya membuat Form Login maka database seperti di bawah ini:

dan berinama sesuai selera untuk database

CREATE TABLE IF NOT EXISTS `tbl_usrs` (

  `id` int(8) NOT NULL AUTO_INCREMENT,

  `username` varchar(30) NOT NULL,

  `password` varchar(40) NOT NULL,

  `email` varchar(60) NOT NULL,

  `status` varchar(8) NOT NULL,

  PRIMARY KEY (`id`)

) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

INSERT INTO `tbl_usrs` (`username`, `password`, `email`, `status`) VALUES

('admin', '21232f297a57a5a743894a0e4a801fc3', 'admin@mydomain.com', 'active');

untuk tester karena disini menggunakan md5 di myql untuk passwor maka User : admin Password : admin

dan selanjutnya mari kita membuat source code model untuk from login berinama aja 'Login_Model.php' taruh di application/model/..

Login_Model.php

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class login_model extends CI_Model
{
     function __construct()
     {
          // Call the Model constructor
          parent::__construct();
     }

     //get the username & password from tbl_usrs
     function get_user($usr, $pwd)
     {
          $sql = "select * from tbl_usrs where username = '" . $usr . "' and password = '" . md5($pwd) . "' and status = 'active'";
          $query = $this->db->query($sql);
          return $query->num_rows();
     }
}?>

dan untuk Controller beri nama 'Login.php' taruh di application/Controller/..

Login.php

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

 

class login extends CI_Controller

{

     public function __construct()

     {

          parent::__construct();

          $this->load->library('session');

          $this->load->helper('form');

          $this->load->helper('url');

          $this->load->helper('html');

          $this->load->database();

          $this->load->library('form_validation');

          //load the login model

          $this->load->model('login_model');

     }

     public function index()

     {

          //get the posted values

          $username = $this->input->post("txt_username");

          $password = $this->input->post("txt_password");

          //set validations

          $this->form_validation->set_rules("txt_username", "Username", "trim|required");

          $this->form_validation->set_rules("txt_password", "Password", "trim|required");

          if ($this->form_validation->run() == FALSE)

          {

               //validation fails

               $this->load->view('login_view');

          }

          else

          {

               //validation succeeds

               if ($this->input->post('btn_login') == "Login")

               {

                    //check if username and password is correct

                    $usr_result = $this->login_model->get_user($username, $password);

                    if ($usr_result > 0) //active user record is present

                    {

                         //set the session variables

                         $sessiondata = array(

                              'username' => $username,

                              'loginuser' => TRUE

                         );

                         $this->session->set_userdata($sessiondata);

                         redirect("index");

                    }

                    else

                    {

                         $this->session->set_flashdata('msg', '<div class="alert alert-danger text-center">Invalid username and password!</div>');

                         redirect('login/index');

                    }

               }

               else

               {

                    redirect('login/index');

               }

          }

     }

}?>

dan utuk view berinama 'Login_view.php sorce code tersebut taruh aja di folder application/view/..

Login_view.php

<!DOCTYPE html>
<html>
<head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Login Form</title>
     <!--link the bootstrap css file-->
     <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
     
     <style type="text/css">
     .colbox {
          margin-left: 0px;
          margin-right: 0px;
     }
     </style>
</head>
<body>
<div class="container">
     <div class="row">
          <div class="col-lg-6 col-sm-6">
               <h1>LIVEDOTCOM</h1>
          </div>
          <div class="col-lg-6 col-sm-6">
               
               <ul class="nav nav-pills pull-right" style="margin-top:20px">
                    <li class="active"><a href="#">Login</a></li>
                    <li><a href="#">Signup</a></li>
               </ul>
               
          </div>
     </div>
</div>
<hr/>

<div class="container">
     <div class="row">
          <div class="col-lg-4 col-sm-4 well">
          <?php 
          $attributes = array("class" => "form-horizontal", "id" => "loginform", "name" => "loginform");
          echo form_open("login/index", $attributes);?>
          <fieldset>
               <legend>Login</legend>
               <div class="form-group">
               <div class="row colbox">
               <div class="col-lg-4 col-sm-4">
                    <label for="txt_username" class="control-label">Username</label>
               </div>
               <div class="col-lg-8 col-sm-8">
                    <input class="form-control" id="txt_username" name="txt_username" placeholder="Username" type="text" value="<?php echo set_value('txt_username'); ?>" />
                    <span class="text-danger"><?php echo form_error('txt_username'); ?></span>
               </div>
               </div>
               </div>
               
               <div class="form-group">
               <div class="row colbox">
               <div class="col-lg-4 col-sm-4">
               <label for="txt_password" class="control-label">Password</label>
               </div>
               <div class="col-lg-8 col-sm-8">
                    <input class="form-control" id="txt_password" name="txt_password" placeholder="Password" type="password" value="<?php echo set_value('txt_password'); ?>" />
                    <span class="text-danger"><?php echo form_error('txt_password'); ?></span>
               </div>
               </div>
               </div>
                              
               <div class="form-group">
               <div class="col-lg-12 col-sm-12 text-center">
                    <input id="btn_login" name="btn_login" type="submit" class="btn btn-default" value="Login" />
                    <input id="btn_cancel" name="btn_cancel" type="reset" class="btn btn-default" value="Cancel" />
               </div>
               </div>
          </fieldset>
          <?php echo form_close(); ?>
          <?php echo $this->session->flashdata('msg'); ?>
          </div>
     </div>
</div>
     
<!--load jQuery library-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!--load bootstrap.js-->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
</body>
</html>

untuk tampilan maksimal anda harus pasang Bootsrap dan jQuery terlebih dahulu.