Codeigniter is a powerful and lightweight framework for developing web applications. As a web developer sometimes you need to add dropdown inputs in your web application form; but further more you like dropdown inputs which are populated with data from the database.
In this tutorial I will guide you through step by step toward adding this type of input in your application. Remember in this tutorial i will not cover form validation and processing, this will be covered in another article.
Requirements:
Codeigniter Framework
- I hope you have created a database and connected it with your Codeigniter application. If not yet do it; you can follow this guide.
- Create table named “job_positions” and populate it; use the snippet bellow.
--
-- Table structure for table `job_positions`
--
CREATE TABLE IF NOT EXISTS `job_positions` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`job_position` varchar(200) DEFAULT NULL,
`description` varchar(200) DEFAULT NULL,
`added_date` date NOT NULL,
`updated_on` datetime NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=5 ;
--
-- Dumping data for table `job_positions`
--
INSERT INTO `job_positions` (`id`, `job_position`, `description`, `added_date`, `updated_on`) VALUES
(1, 'Customer care', 'Dealing with customer care', '2016-06-01', '0000-00-00 00:00:00'),
(2, 'IT Staff', 'Dealing with ICT', '2015-12-02', '2015-12-02 00:00:00'),
(3, 'Bursar', 'Dealing with financial activities', '2015-12-02', '2015-12-11 00:00:00'),
(4, 'Sales Officer', 'Dealing with Sales tasks', '2016-06-01', '0000-00-00 00:00:00');
-- --------------------------------------------------------- Create Model named Job_positions_model with the following codes. This will help us to query data from the db also I will add selected value of input which is “Please select position…”
< ? php
class Job_positions_model extends CI_Model {
function __construct() {
parent::__construct();
}
//get job positions from the db
public
function get_job_positions() {
$result = $this - > db - > select('id, job_position') - > get('job_positions') - > result_array();
$job_position = array();
foreach($result as $r) {
$job_position[$r['id']] = $r['job_position'];
}
$job_position[''] = 'Select job position...';
return $job_position;
}
}- Create Controller named Job_positions and add the following snippet. This controller fetches data from Job_positions_model and passes it to view. Remember you need to load the Job_positions_model, form helper and Database; for me I have loaded database and form helper in auto-load; also you can auto-load model. Read more about Codeigniter loader class here.
< ? php
if (!defined('BASEPATH'))
exit('No direct script access allowed');
class Job_positions extends CI_Controller {
function __construct() {
parent::__construct();
//load model
$this - > load - > model('Job_positions_model');
}
public
function index() {
//fetch data from Job_positions_model
$data['job_positions'] = $this - > Job_positions_model - > get_job_positions();
//pass data to view
$this - > load - > view('Job_positions_view', $data);
}
}- Next create a view file named Job_positions_view and add the following snippet. Note: I will add bootstrap to make my input looks nice.
<!DOCTYPE html>
<html>
<title>CI DB Dropdown input</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<body>
<div class="col-sm-4">
<br>
<br>
<h2>Our Dropdown input Demo</h2>
<br>
<br>
<div class="panel panel-default">
<div class="panel-heading">The form</div>
<div class="panel-body">
<!--dropdown input-->
<label class="title">Job position: </label>
<?php echo form_dropdown('job_position', $job_positions, '', 'class="form-control"');?>
<br>
<br>
<button type="submit" class="btn btn-info">Submit</button>
</div>
</div>
</div>
</body>
</html>- Finally save and preview your work through www.yoursite.com/index.php/Job_positions.
My Demo is here: DEMO
I hope everything go right; please provide your feedback in the comments bellow. Thank you for reading.