Now, since we are familiar with the basics of CodeIgniter, we will develop a simple web application for user registration in MVC framework.
Color Codes:
Code in blue
Output in green
URL in red
Notes and comments in dark grey
Scenario:
Let us create a database with following details.
| Parameter | Value |
| Database name | ci |
| Database username | root |
| Database password | root |
Inside, this database we will create a table named members. The table structure shall look like following:
| Field | Type | Remarks |
| id | int(11) | Primary key with auto increment |
| name | varchar(50) |
Database connection:
We need to define database connection variables in the file config.php located in the directory application/config/ as follows:
$db['default'] = array(
'dsn' => '',
'hostname' => 'localhost',
'username' => 'root',
'password' => 'root',
'database' => 'ci',
'dbdriver' => 'mysqli',
'dbprefix' => '',
'pconnect' => FALSE,
'db_debug' => (ENVIRONMENT !== 'production'),
'cache_on' => FALSE,
'cachedir' => '',
'char_set' => 'utf8',
'dbcollat' => 'utf8_general_ci',
'swap_pre' => '',
'encrypt' => FALSE,
'compress' => FALSE,
'stricton' => FALSE,
'failover' => array(),
'save_queries' => TRUE
);
For now, we need to define hostname,username,password and database.
Now, let us dive into the process of user registration.
In terms of MVC, we can breakdown the application into following components:
| File | Role | Path | MVC Component |
| user_add_form.php | Web page with input form for user registration. | applications/views/ | View |
| User_add_action.php | Action file for the user registration input form at user_add_form.php. | applications/controllers/ | Controller |
| User_add_db.php | Model file to connect to database and add data to database | applications/models/ | Model |
| confirmation.php | Web page showing confirmation of data entry. | applications/views/ | View |
| User.php | Main controller file to load user_add_form.php view | applications/controllers/ | Controller |
Note: We can see that User_add_action.php file though being the action file for the input form doesn't add data to the database itself. Rather, it passes the data to the model file User_add_db.php which will then connect to the database and perform the insert operation.
In MVC we should always start with controllers since they manage the flow control of the application and are accessed through URL.
Let us work on the main controller file User.php. The file shall contain following function.
| Function | Purpose |
| __construct | Constructor function to call the parent class (CI_Controller) constructor function. This makes loading of views and models through controller possible. |
| add | To load the view file user_add_form.php for user registration |
File: User.php
Code:
<?php
class User extends CI_Controller
{
public function __construct()
/*
The function is called before add function.
*/
{
parent::__construct();
/*
Calling the constructor of the parent class CI_Controller makes sure we can load models and views from the controller.
Since loading is always done through the controller, parent constructor calling is only required in the controller class.
*/
}
public function add()
// This function is responsbile for displaying the add form
{
$this->load->view('user_add_form');
/*
Loading view, user_add_form.php for user registration form.
If parent constructor calling was not done in constructor function above, the function view() would not be available.
*/
}
}
?>
Now, add function can be accessed from following URL:
http://localhost/ci/user/add
This URL will load the view file, user_add_form.php
File: user_add_form.php
Code:
<!DOCTYPE html>
<html>
<head>
<title>Staff List</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">
</head>
<body>
<p>
</p>
<div class="w3-container">
<form name="form" method="post" action="http://localhost/ci/user_add_action">
<!--http://localhost/ci/user_add_action refers to the controller file User_add_action.php-->
<div class="w3-container w3-teal w3-text-black"><h1>Enter your name</h1></div>
<p><input type="text" class="w3-input" name="name"/></p>
<p><input class="w3-input" type="submit" name="submit"/></p>
</form>
</div>
</body>
</html>
File: User_add_action.php
Code:
<?php
class User_add_action extends CI_Controller
{
public function __construct()
{
parent::__construct();
// Caling parent class constructor to load model
$this->load->model('user_add_db');
// Loading model file User_add_db.php
}
public function index()
{
$result=$this->user_add_db->add_data();
// Calling the function add_data() of the model file User_add_db.php to add data to the database
}
}
?>
File: User_add_db.php
Code:
<?php
class User_add_db extends CI_Model
{
public function __construct()
{
$this->load->database();
// Connects to the database defined in config.php
}
public function add_data()
{
$name = $this->input->post('name');
/*
Passing the value of input textfield 'name'
Similar to $name=$_POST['name'];
*/
$data = array('name' => $name);
/*
In CI, we can use either array or object to push data to database. Using array in this case.
The key of the array for the given variable should be same as the name of the field in the table.
*/
$this->db->insert('test',$data);
// This is where the actual data insertion occurs. CI uses short form form SQL queries.
$this->load->view('confirmation');
// Loads the view file confirmation.php to the user.
}
}
?>
File: confirmation.php
Code:
<html>
<head><title>Congratulations</title></head>
<body>
<h1>Data added successfully.</h1>
</body>
</html>
Output: