Coders Mag

Web Development Tutorials & Web Developer Resources

Skip to content
Menu
  • Home
  • Tutorials
    • PHP
    • CodeIgniter
    • jQuery
  • LIVE DEMO

CodeIgniter Login and Registration System using MySQL with Bootstrap 4

Posted onJune 15, 2019October 3, 2021by CodersMag Team
In this tutorial, I explain how you can develop CodeIgniter Login and Registration System using MySQL with Bootstrap 4. I will just cover registration form in very simple without email verification. By using this user can easily register, first name, last name, email, password, contact_no, address and dob fields. After submitting form, the data will be stored in a database table. This is a very simple example, you can just copy paste and change according to your requirement.
Before started to implement the Login and Registration System, look files structure:
  • codeIgniter-login-registration-system-using-mysql-bootstrap
    • application
      • config
        • constants.php
        • database.php
        • routes.php
      • controllers
        • Auth.php
      • models
        • Auth_model.php
      • views
        • auth
          • registration.php
          • login.php
          • index.php
        • templates
          • header.php
          • footer.php
    • system
    • index.php
    • assets
      • css
        • style.css
Step 1: Create MySQL Database and Table for storing data
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
26
<?php
  CREATE TABLE `users` (
    `id` int(11) NOT NULL COMMENT 'Primary Key',
    `first_name` varchar(100) NOT NULL COMMENT 'First Name',
    `last_name` varchar(100) NOT NULL COMMENT 'Last Name',
    `user_name` varchar(100) NOT NULL COMMENT 'Last Name',
    `email` varchar(255) NOT NULL COMMENT 'Email Address',
    `password` varchar(255) NOT NULL COMMENT 'Password',
    `address` text NOT NULL,
    `dob` varchar(15) NOT NULL COMMENT 'Date Of Birth',
    `contact_no` varchar(16) NOT NULL COMMENT 'Contact No',
    `url` int(255) DEFAULT NULL,
    `verification_code` varchar(255) NOT NULL COMMENT 'verification Code',
    `created_date` varchar(12) NOT NULL COMMENT 'created timestamp',
    `modified_date` varchar(12) NOT NULL COMMENT 'modified timestamp',
    `status` char(1) NOT NULL COMMENT '0=pending, 1=active, 2=delete'
  ) ENGINE=InnoDB DEFAULT CHARSET=latin1 COMMENT='datatable demo table';
 
 
ALTER TABLE `users`
  ADD PRIMARY KEY (`id`);
 
ALTER TABLE `users`
  MODIFY `id` int(11) NOT NULL AUTO_INCREMENT COMMENT 'Primary Key';
 
?>
  • Codeigniter Setting:
  • Setup base path in config/config.php
  • Add database credentials in config/database.php
  • Autoload database library in config/autoload.php like $autoload['libraries'] = array('database');
  • Autoload url helper in config/autoload.php like $autoload['helper'] = array('url');
  • Add user as default controller in config/routes.php
Step 2: Create a Auth model handles the database
Create a model file named Auth_model.php inside “application/models” folder.
  • setter getter method and variables
  • create() – Insert user data in the database.
  • hash() – Insert Secure password using password_hash technique
  • login() – Fetch the user data from the database based on the conditions specified in the username and password. Returns the records on success or failed.
  • verifyHash() – check and verify password. Returns the records on success or failed.
  • generateUniqueUserName() – create unique username
  • cleanUserName() – clean user name
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
<?php
 
/* * ***
* Version: 1.0.0
*
* Description of Auth model
*
* @author Coders Mag
*
* @email  info@codersmag.com
*
* *** */
if (!defined('BASEPATH'))
    exit('No direct script access allowed');
 
class Auth_model extends CI_Model {
    // Declaration of a variables
    private $_userID;
    private $_userName;
    private $_firstName;
    private $_lastName;
    private $_email;
    private $_password;
    private $_contactNo;
    private $_address;
    private $_dob;
    private $_verificationCode;
    private $_timeStamp;
    private $_status;
    //Declaration of a methods
    public function setUserID($userID) {
        $this->_userID = $userID;
    }
    public function setUserName($userName) {
        $this->_userName = $userName;
    }
 
    public function setPassword($password) {
        $this->_password = $password;
    }
    public function setFirstname($firstName) {
        $this->_firstName = $firstName;
    }
    public function setLastName($lastName) {
        $this->_lastName = $lastName;
    }
    public function setEmail($email) {
        $this->_email = $email;
    }
    public function setContactNo($contactNo) {
        $this->_contactNo = $contactNo;
    }
    public function setAddress($address) {
        $this->_address = $address;
    }
    public function setDOB($dob) {
        $this->_dob = $dob;
    }
    public function setVerificationCode($verificationCode) {
        $this->_verificationCode = $verificationCode;
    }
    public function setTimeStamp($timeStamp) {
        $this->_timeStamp = $timeStamp;
    }
    public function setStatus($status) {
        $this->_status = $status;
    }
    //create new user
    public function create() {
        $hash = $this->hash($this->_password);
        $data = array(
            'user_name' => $this->_userName,
            'first_name' => $this->_firstName,
            'last_name' => $this->_lastName,
            'email' => $this->_email,
            'password' => $hash,
            'contact_no' => $this->_contactNo,
            'address' => $this->_address,
            'dob' => $this->_dob,
            'verification_code' => $this->_verificationCode,
            'created_date' => $this->_timeStamp,
            'modified_date' => $this->_timeStamp,
            'status' => $this->_status
        );
        $this->db->insert('users', $data);
        if (!empty($this->db->insert_id()) && $this->db->insert_id() > 0) {
            return TRUE;
        } else {
            return FALSE;
        }
    }
      
    // login method and password verify
    function login() {
        $this->db->select('id as user_id, user_name, email, first_name, password');
        $this->db->from('users');
        $this->db->where('email', $this->_userName);
        $this->db->where('verification_code', 1);
        $this->db->where('status', 1);
        //{OR}
        $this->db->or_where('user_name', $this->_userName);
        $this->db->where('verification_code', 1);
        $this->db->where('status', 1);
        $this->db->limit(1);
        $query = $this->db->get();
        if ($query->num_rows() == 1) {
            $result = $query->result();
            foreach ($result as $row) {
                if ($this->verifyHash($this->_password, $row->password) == TRUE) {
                    return $result;
                } else {
                    return FALSE;
                }
            }
        } else {
            return FALSE;
        }
    }
    
    // password hash
    public function hash($password) {
        $hash = password_hash($password, PASSWORD_DEFAULT);
        return $hash;
    }
    // password verify
    public function verifyHash($password, $vpassword) {
        if (password_verify($password, $vpassword)) {
            return TRUE;
        } else {
            return FALSE;
        }
    }
 
    // generate Unique Username
    public function generateUniqueUserName($tableName, $string, $field, $key = NULL, $value = NULL) {
        $slug = $this->cleanUserName($string);
        $i = 0;
        $params = array();
        $params[$field] = $slug;
        if ($key)
            $params["$key !="] = $value;
        while ($this->db->where($params)->get($tableName)->num_rows()) {
            if (!preg_match('/[0-9]+$/', $slug))
                $slug .= '' . ++$i;
            else
                $slug = preg_replace('/[0-9]+$/', ++$i, $slug);
            $params [$field] = $slug;
        }
        return $slug;
    }
 
    // clean Username
    public function cleanUserName($string) {
        //Lower case everything
        $string = strtolower(trim($string));
        //Make alphanumeric (removes all other characters)
        $string = preg_replace("/[^a-z0-9_\s-]/", "", $string);
        //Clean up multiple dashes or whitespaces
        $string = preg_replace("/[\s-]+/", " ", $string);
        //Convert whitespaces and underscore to dash
        $string = preg_replace("/[\s_]/", "", $string);
        $string = rtrim($string, '');
        return $string;
    }
 
}
 
?>
Step 3: Create a controller file
Create a controller file named Auth.php inside “application/controllers” folder.
  • The Auth controller handles the login and registration process.
  • __construct() – Loads the required library, helper and model.
  • registration() – load register form.
  • actionRegister() – save register form data
  • login() – load load form.
  • doLogin() – check validate login credentials
  • logout() – Logouts users from their account.
  • profile() – Displays user account details after login.
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<?php
 
/* * ***
* Version: 1.0.0
*
* Description of Auth Controller
*
* @author CodersMag Team
*
* @email  info@codersmag.com
*
* *** */
if (!defined('BASEPATH'))
    exit('No direct script access allowed');
 
class Auth extends CI_Controller {
 
    public function __construct() {
        parent::__construct();
        //load model
        $this->load->model('Auth_model', 'auth');
        $this->load->library('form_validation');
    }
 
    // index method
    public function registration() {        
        $data = array();
        $data['metaDescription'] = 'Registration';
        $data['metaKeywords'] = 'Registration';
        $data['title'] = "Registration - CodersMag";
        $data['breadcrumbs'] = array('Login' => '#');
        
        $this->load->view('auth/registration', $data);
    }
 
    // action create user method
    public function actionRegister() {
        $this->form_validation->set_rules('first_name', 'First Name', 'required');
        $this->form_validation->set_rules('email', 'Email', 'trim|required|valid_email|is_unique[users.email]');
        $this->form_validation->set_rules('contact_no', 'Contact No', 'required|regex_match[/^[0-9]{10}$/]');
        $this->form_validation->set_rules('password', 'Password', 'trim|required|min_length[8]');
        $this->form_validation->set_rules('confirm_password', 'Password Confirmation', 'trim|required|matches[password]');
        $this->form_validation->set_rules('address', 'Address', 'required');
        $this->form_validation->set_rules('dob', 'Date of Birth(DD-MM-YYYY)', 'required');
        if ($this->form_validation->run() == FALSE) {
            $this->registration();
        } else {
            $firstName = $this->input->post('first_name');
            $lastName = $this->input->post('last_name');
            $email = $this->input->post('email');
            $password = $this->input->post('password');
            $contactNo = $this->input->post('contact_no');
            $dob = $this->input->post('dob');
            $address = $this->input->post('address');
            $timeStamp = time();
            $status = 1;
            $verificationCode = 1;
            $userName = $this->auth->generateUniqueUserName('users', trim($firstName . $lastName), 'user_name', NULL, NULL);
            $this->auth->setUserName($userName);
            $this->auth->setFirstName(trim($firstName));
            $this->auth->setLastName(trim($lastName));
            $this->auth->setEmail($email);  
            $this->auth->setPassword($password);
            $this->auth->setContactNo($contactNo);
            $this->auth->setAddress($address);
            $this->auth->setDOB($dob);
            $this->auth->setVerificationCode($verificationCode);
            $this->auth->setTimeStamp($timeStamp);
            $this->auth->setStatus($status);
            $chk = $this->auth->create();
            redirect('auth/login');
        }
    }
    
    // login method
    public function login() {        
        $data = array();
        $data['metaDescription'] = 'Login';
        $data['metaKeywords'] = 'Login';
        $data['title'] = "Login - CodersMag";
        $data['breadcrumbs'] = array('Login' => '#');
        
        $this->load->view('auth/login', $data);
    }
    
 
    // action login method
    function doLogin() {        
        // Check form  validation
        $this->load->library('form_validation');
        $this->form_validation->set_rules('user_name', 'User Name', 'trim|required');
        $this->form_validation->set_rules('password', 'Password', 'trim|required');
        if ($this->form_validation->run() == FALSE) {
            //Field validation failed.  User redirected to login page
            $this->login();
        } else {
          $sessArray = array();
            //Field validation succeeded.  Validate against database
            $username = $this->input->post('user_name');
            $password = $this->input->post('password');
            
            $this->auth->setUserName($username);
            $this->auth->setPassword($password);
            //query the database
            $result = $this->auth->login();
 
            if (!empty($result) && count($result) > 0) {
                foreach ($result as $row) {
                    $authArray = array(
                        'user_id' => $row->user_id,
                        'first_name' => $row->first_name,
                        'address' => $row->address,
                        'user_name' => $row->user_name,
                        'email' => $row->email,
                        'is_authenticate_user' => TRUE,
                    );
                    $this->session->set_userdata('ci_session_key_generate', TRUE);
                    $this->session->set_userdata('ci_seesion_key', $authArray);
                    // remember me
                    if(!empty($this->input->post("remember"))) {
                      setcookie ("loginId", $username, time()+ (10 * 365 * 24 * 60 * 60));  
                      setcookie ("loginPass", $password,  time()+ (10 * 365 * 24 * 60 * 60));
                    } else {
                      setcookie ("loginId","");
                      setcookie ("loginPass","");
                    }                    
                }
                redirect('auth/profile');
            } else {
                $this->login();
            }
        }
    }
    // profile page
    public function profile() {  
        if ($this->session->userdata('ci_seesion_key')['is_authenticate_user'] == FALSE) {
            redirect('auth/login');
        } else {    
            $data = array();
            $data['metaDescription'] = 'Profile';
            $data['metaKeywords'] = 'Profile';
            $data['title'] = "Profile - CodersMag";
            $data['breadcrumbs'] = array('Profile' => '#');
            $this->load->view('auth/index', $data);
        }
    }
    //logout method
    public function logout() {
        $this->session->unset_userdata('ci_seesion_key');
        $this->session->unset_userdata('ci_session_key_generate');
        $this->session->sess_destroy();
        $this->output->set_header("Cache-Control: no-store, no-cache, must-revalidate, no-transform, max-age=0, post-check=0, pre-check=0");
        $this->output->set_header("Pragma: no-cache");
        redirect('auth/login');
    }  
 
}
?>
Step 4: Create a view(header)
Create a view file named header.php inside “application/views/templates” folder
This view contains the header section of the webpage. The Bootstrap library is used to provide a better UI, so, include it in the 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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
?>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="description" content="">
  <meta name="author" content="">
  <link rel="icon" type="image/ico" href="<?php print HTTP_IMAGE_PATH; ?>favicon.ico">
  <title><?php print $title; ?></title>
  <!-- Bootstrap core CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css" />
  <!-- Custom fonts for this template -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.7.2/css/all.min.css" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/simple-line-icons/2.4.1/css/simple-line-icons.css" />
  <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
  <!-- Custom styles for this template -->
  <link href="<?php print HTTP_CSS_PATH; ?>style.css" rel="stylesheet">
</head>
<body>
  <!-- Navigation -->
  <nav class="navbar navbar-expand-lg navbar-dark bg-dark static-top header-bg-dark" style="background: ##FFFFFF!;">
  <div class="container">
    <a class="navbar-brand font-weight-bold" href="https://codersmag.com"><h1>Coders Mag</h1></a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
    <div class="collapse navbar-collapse" id="navbarResponsive">
      <ul class="navbar-nav ml-auto">
        <li class="nav-item active">
          <a class="nav-link" href="https://codersmag.com">Home
                <span class="sr-only">(current)</span>
              </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="https://codersmag.com/php-script-demos/">Live Demo</a>
        </li>
      </ul>
    </div>
  </div>
</nav>
Step 5: Create a view(footer)
Create a view file named footer.php inside “application/views/templates” folder
This view contains the footer section of the webpage.
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<!-- Footer -->
  <footer class="footer bg-light footer-bg-dark">
    <div class="container">
      <div class="row">
        <div class="col-lg-6 h-100 text-center text-lg-left my-auto">
          <ul class="list-inline mb-2">
            <li class="list-inline-item">
              <a href="#">About</a>
            </li>
            <li class="list-inline-item">&sdot;</li>
            <li class="list-inline-item">
              <a href="#">Contact</a>
            </li>
            <li class="list-inline-item">&sdot;</li>
            <li class="list-inline-item">
              <a href="#">Terms of Use</a>
            </li>
            <li class="list-inline-item">&sdot;</li>
            <li class="list-inline-item">
              <a href="#">Privacy Policy</a>
            </li>
          </ul>
          <p class="small mb-4 mb-lg-0" style="color: #E6ECF0;">Copyright &copy;  2017 - <?php print date('Y', time());?> <a style="color: #E6ECF0;" href="https://codersmag.com/">CODERSMAG.COM</a> All rights reserved.</p>
        </div>
        <div class="col-lg-6 h-100 text-center text-lg-right my-auto">
          <ul class="list-inline mb-0">
            <li class="list-inline-item mr-3">
              <a href="#">
                <i class="fab fa-facebook fa-2x fa-fw"></i>
              </a>
            </li>
            <li class="list-inline-item mr-3">
              <a href="#">
                <i class="fab fa-twitter-square fa-2x fa-fw"></i>
              </a>
            </li>
            <li class="list-inline-item">
              <a href="#">
                <i class="fab fa-instagram fa-2x fa-fw"></i>
              </a>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </footer>
  <!-- Bootstrap core JavaScript -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.bundle.min.js"></script>
  <script>
    var baseurl = "<?php print site_url();?>";
  </script>
</body>
</html>    
Step 6: Create a view(registration)
Create a view file named registration.php inside “application/views/auth” folder
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
   <?php $this->load->view('templates/header');?>
<!-- container -->
  <section class="showcase">
    <div class="container">
      <div class="pb-2 mt-4 mb-2 border-bottom">
        <h2>CodeIgniter Login and Registration System using MySQL with Bootstrap 4</h2>
      </div>
      <form action="<?php print site_url();?>auth/actionRegister" class="remember-login-frm" id="remember-login-frm" method="post" accept-charset="utf-8" enctype="multipart/form-data">
      <div class="row justify-content-center">
    <div class="col-12 col-md-8 col-lg-6 pb-5">
    <div class="row"><ul style="color: #CB0000"><?php echo validation_errors('<li>', '</li>'); ?></div>
        <!--Form with header-->
            <div class="card border-info rounded-0">
                <div class="card-header p-0">
                    <div class="bg-login-page text-white text-center py-2">
                        <h3><i class="fas fa-user-plus"></i> Registration</h3>
                    </div>
                </div>
                <div class="card-body p-3">                
                    <!--Body-->
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="fas fa-user"></i></div>
                            </div>
                            <input type="text" class="form-control" id="first-name" name="first_name" placeholder="First Name">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="fas fa-user"></i></div>
                            </div>
                            <input type="text" class="form-control" id="last-name" name="last_name" placeholder="Last Name">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="fas fa-envelope-square"></i></div>
                            </div>
                            <input type="text" class="form-control" id="email" name="email" placeholder="Email *">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="fas fa-key"></i></div>
                            </div>
                            <input type="password" class="form-control" id="password" name="password" placeholder="Password *">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="fas fa-key"></i></div>
                            </div>
                            <input type="password" class="form-control" id="confirm-password" name="confirm_password" placeholder="Confirm Password *">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="fas fa-phone-square"></i></div>
                            </div>
                            <input type="text" class="form-control" id="contact-no" name="contact_no" placeholder="Contact No">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="fas fa-map-marker-alt"></i></div>
                            </div>
                            <input type="text" class="form-control" id="address" name="address" placeholder="Address">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="far fa-calendar-alt"></i></div>
                            </div>
                            <input type="text" class="form-control" id="dob" name="dob" placeholder="DOB">
                        </div>
                    </div>
                                                      
                    <div class="text-center">
                        <button type="submit" id="contact-send-a" class="btn btn-info btn-block rounded-0 py-2">Register</button>
                    </div>
                    
                </div>
            </div>
          </div>
        </div>
    </form>
    </div>
  </section>
<?php $this->load->view('templates/footer');?>        
Step 7: Create a view(login)
Create a view file named login.php inside “application/views/auth” folder
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
   <?php $this->load->view('templates/header');?>
<!-- container -->
  <section class="showcase">
    <div class="container">
      <div class="pb-2 mt-4 mb-2 border-bottom">
        <h2>CodeIgniter Login and Registration System using MySQL with Bootstrap 4</h2>
      </div>
      <form action="<?php print site_url();?>auth/doLogin" class="remember-login-frm" id="remember-login-frm" method="post" accept-charset="utf-8" enctype="multipart/form-data">
      <div class="row justify-content-center">
    <div class="col-12 col-md-8 col-lg-6 pb-5">
    <div class="row"><?php echo validation_errors('<div class="col-12 col-md-12 col-lg-12"><div class="alert alert-danger alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert">&times;</button>', '</div></div>'); ?></div>
        <!--Form with header-->
            <div class="card border-info rounded-0">
                <div class="card-header p-0">
                    <div class="bg-login-page text-white text-center py-2">
                        <h3><i class="fa fa-user"></i> Login</h3>
                    </div>
                </div>
                <div class="card-body p-3">                
                    <!--Body-->
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="fa fa-user text-info"></i></div>
                            </div>
                            <input type="text" class="form-control" id="remail" name="user_name" placeholder="Email *" value="<?php if(isset($_COOKIE["loginId"])) { echo $_COOKIE["loginId"]; } ?>">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group mb-2">
                            <div class="input-group-prepend">
                                <div class="input-group-text"><i class="fa fa-key text-info" aria-hidden="true"></i></div>
                            </div>
                            <input type="password" class="form-control" id="rpassword" name="password" placeholder="Password *" value="<?php if(isset($_COOKIE["loginPass"])) { echo $_COOKIE["loginPass"]; } ?>">
                        </div>
                    </div>                                
                    
                    <div class="form-group">
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" name="remember" <?php if(isset($_COOKIE["loginId"])) { ?> checked="checked" <?php } ?>> Remember Me
                            </label>                                    
                        </div>
                    </div>
                    
                    <div class="text-center">
                        <button type="submit" id="contact-send-a" class="btn btn-info btn-block rounded-0 py-2">Login</button>
                    </div>
                    <br>
                    <span>Not a user? <a href="<?php print site_url()?>auth/registration">Register Now</a></span>
                </div>
            </div>
          </div>
        </div>
    </form>
    </div>
  </section>
<?php $this->load->view('templates/footer');?>        
Step 8: Create a view(index)
Create a view file named index.php inside “application/views/auth” folder
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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
   <?php $this->load->view('templates/header');?>
<style>
.card {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  max-width: 300px;
  margin: auto;
  text-align: center;
  font-family: arial;
}
.title {
  color: grey;
  font-size: 18px;
}
.button {
  border: none;
  outline: 0;
  display: inline-block;
  padding: 8px;
  color: white;
  background-color: #3498DB;
  text-align: center;
  cursor: pointer;
  width: 100%;
  font-size: 18px;
}
button:hover, a:hover {
  opacity: 0.9;
}
</style>
<!-- container -->
  <section class="showcase">
    <div class="container">
      <div class="pb-2 mt-4 mb-2 border-bottom">
        <h2>Login with Remember Me using Codeigniter and MySQL</h2>
      </div>
      <span id="success-msg"></span>      
      <form action="<?php print site_url();?>auth/doLogin" class="remember-login-frm" id="remember-login-frm" method="post" accept-charset="utf-8" enctype="multipart/form-data">
      <div class="card">          
  <img src="<?php print HTTP_IMAGE_PATH;?>blank-profile.png" alt="John" style="height:120px; width:100%">
  <br>
  <h3><?php print $this->session->userdata('ci_seesion_key')['first_name']; ?></h3>
  <p class="title"><?php print $this->session->userdata('ci_seesion_key')['address']; ?></p>
  <?php if($this->session->userdata('ci_seesion_key')) { ?>
    <p><?php print $this->session->userdata('ci_seesion_key')['email']; ?></p>
  <?php } ?>
  <div style="margin: 10px 0;">    
    <a href="#"><i class="fab fa-facebook"></i></a>
    <a href="#"><i class="fab fa-linkedin"></i></a>
    <a href="#"><i class="fab fa-twitter"></i></a>
    <a href="#"><i class="fab fa-instagram"></i></a>
  </div>
  <p><a href="<?php print site_url();?>auth/logout" class="button">Logout</a></p>
</div>
    </form>
    </div>
  </section>
<?php $this->load->view('templates/footer');?>        
Demo Download
Posted in: PHP, TutorialsTags: CodeIgniter, CodeIgniter Login & Registration System

Post navigation

Prev Top 5 Best PHP Frameworks of 2023
Next Implement Calendar in CodeIgniter with jQuery AJAX

Recent Posts

  • How to Encrypt and Decrypt Passwords in PHP October 15, 2023
  • CodeIgniter 4 Authentication Login and Registration February 12, 2023
  • Pagination Using PHP and MySQL December 31, 2022
  • Import CSV File into MongoDB using Python March 6, 2022
  • Login with Facebook using PHP SDK October 16, 2021
Copyright © 2017 - 2024 CODERSMAG.COM All rights reserved.
Slot Online