We already know that the codeignter is best PHP framework ,library and a simple cms. a lot of people agree that codeigniter is library. we discussed some features of codeiginter. Now we are going to learn how to make a select box aka form drop down menu using codeigniter. There is so many ways to make this select box using codeigniter php framework. Good news is that codeigniter released version 2 with lot of features also,unfortunately it supports PHP 5 only.

We can make the select box with codeigniter framework in three ways:

• Directly inputing the associative array to form_dropdown codeigniters HTML helper function.
• Directly inputing an indexed array to form_dropdown codeigniters HTML helper function.
• HTML PHP parsing mechanism,with template without form_dropdown function.

I think all of us know about the type of arrays in php , nevermind letus know a bit cause some of us no alteast one of us dont know.

According to the elements types with array we categorised associate array, indexed array, mixed array.

		$options1=array(1,2,3,4,5);
		//assoc array
		$options2=array('op1'=>'opton1','op2'=>'opton2','op3'=>'opton3');
		//mixed array contains indexed and assoc array elements
		$options3=array('op1'=>'opton1','op2'=>'opton2',1,4);
		//associative  array
		$options4=array('op1'=>'opton1','op2'=>'opton2','op3'=>'opton3');
        //this rang function will return 3,4,5 elements indexed array
        $options=range(3,5);

A mixed array can contain not only different keys ,can also have different type of elements also

form_dropdown has basically four input parameters.

1. param1: name the select box or drop down box, it is string.
2. param2: any indexed or associative array
3. param3: default selected options in select box with array format
4. param4: this is the string which can be printed on selecte box attributes directly.

Even though form_dropdown has four parameters, we must pass alteast two parameters param1 and param2.

Before going to start our example we must know codeignite MVC mechanism, atleast about controller. no problem we see all examples in single controller called select.php and i provided inline comments that will help us .

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
 
class Select extends CI_Controller {
 
	function __construct()
	{
		parent::__construct();
	}
 
	function index()
	{
		$this->load->helper('form');
		//indexed array
		$options1=array(1,2,3,4,5);
		//assoc array
		$options2=array('op1'=>'opton1','op2'=>'opton2','op3'=>'opton3');
		//mixed array contains indexed and assoc array elements
		$options3=array('op1'=>'opton1','op2'=>'opton2',1,4);
		//assoc array
		$options4=array('op1'=>'opton1','op2'=>'opton2','op3'=>'opton3');
		//add one more element
		$options4['op4']='option4';
		//creates dynamic indexed array from 3 to 5 values 
		$options=range(3,5);
 
		//array elements which are selected by default , these are keys of the options array
		$selected_opt=array('op1','op3');
		$selected_opt2=array(1,2);
		//adding extra HTML attributes to form drop down with a string
		$extra_attributes1='id="dropy" style="color:blue;"';
 
		echo form_dropdown('drop1', $options);
		echo form_dropdown('drop2', $options1);
		echo '<br/><br/>';
		echo form_dropdown('drop3', $options2);
		echo '<br/><br/>';
		echo form_dropdown('drop4', $options3);
		echo '<br/><br/>';
		echo form_dropdown('drop5', $options4);
		echo '<br/><br/>';
		echo form_dropdown('drop6', $options2,'op3');
		echo '<br/><br/>';
		echo form_dropdown('drop7', $options2,$selected_opt);
		echo '<br/><br/>';
		echo form_dropdown('drop8', $options2,$selected_opt,$extra_attributes1);
		echo '<br/><br/>';
		echo form_dropdown('drop9', $options2,$selected_opt,'id="dropu" onclick="alert(\'you changed options!!\');"');
		echo '<br/><br/>';
		echo form_dropdown('drop9', $options2,$selected_opt,'id="dropu" size=2');
		echo '<br/><br/>';
 
		$this->load->view('select');
 
 
 
 
	}
}
 
/* End of file select.php */
/* Location: ./application/controllers/select.php */
?>

Download Source Code

Installation and testing: please download the source code from above link and extract the zip file and paste the application folder in you codeiginter folder ,it ask for replace the folder ,just replace and test the package with following URL in your local server. this url is without SEF htacces.

http://localhost/index.php/select/

We are familiar with Codeigniter comes with optional SEF URLs, but we use non SEF urls in production or development version.

1
2

http://localhost/index.php/helloworld/welcome/
http://localhost/helloworld/welcom/

In the above snippet we know that line 1 is default URL which contains index.php in URl part that used in development version.
Second line is the deployed version SEF URL, generally we need some tweaks with .htaccess and configure stuff.

htaccess

Open note pad and copy and paste below code into that and save it as .htaccess and copy this file into your codeigniters root directory where it was installed.

1
2
3
4
5
6

DirectoryIndex index.php
RewriteEngine on
RewriteCond $1 !^(index\.php|images|css|js|robots\.txt|favicon\.ico)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ ./index.php/$1 [L,QSA]

Line 1: set index.php as default directory index instead of index.html

Line 2: Start rewriting engine on

Line 3: start a condition that won’t meet this situation where the request to static resources like images , css, javascript , robot text files

Line 4: make condition user requests a valid request

Line 5: make condition no physical file exists with the given URL

Line 6: if above conditions all met redirect the request to index.php on installation

making changes to config.php file

open the file in the directory system/application/config/config.php make following changes.
Find below line

$config['index_page'] = "index.php";

Replace above line with below code

$config['index_page'] = "";

Now test the new URLs ,it done.

Here we learn how to use anchor method that is URL helper of Codeigniter.We already discussed in my previous post URL structure of Codeigniter. It creates a anchor tag in HTML view.

We can create anchor links in two ways.

• by using anchor function available in URL helper of Codeigniter.
• by using site_url function available in URL helper of Codeigniter.

Below examples shows how to make HTML link Using anchor function

anchor tag with two parameters,parameter 1 takes segments of the targe page,parameter 2 takes link text.

1
2
3
4

<?php  
echo anchor('controller/method/parameter1', 'Link Text');
// <a href="http://example.com/index.php/controller/method/parameter1">Link Text</a>
?>

anchor tag with additional attributes like title

1
2
3

<?php  
echo anchor('controller/method/parameter1', 'Link  with Title attribute',array('title'=>'Link Title'));// <a href="http://example.com/index.php/controller/method/parameter1" title="Link Title">Link  with Title attribute</a>
?>

anchor tag with javascript attribute.

1
2
3
4
5

<?php  
echo anchor('controller/method/parameter1', 'Link  with Title and javascript',array('title'=>'Link Title','onclick'=>"alert('hi');return false;"));
//<a href="http://example.com/index.php/controller/method/parameter1" title="Link Title" onclick="alert('hi');return false;">Link  with Title and javascript</a>
 
?>

remember anchor tag won’t create internel page link.

Below examples show how to make HTML link using site_url function

We can use site_url output as href attribute and can make internel links also.

1
2

<p><a href="<?php echo site_url('controller/method/parameter1'); ?>">with site_url function </a></p>
<p><a href="<?php echo site_url('controller/method/parameter1'); ?>" title="link title">with site_url function and title attribute </a></p>

Test it in your local system

To test these functions ,just download the example files and paste into your codeigniter root directory. run the example.

if you have any queries you can mail me.

Preview

To run below examples,we use default welcome controller and welcome_message view. You can see below image where it located.when you run it executes welcome.php controller and loads view welcome_message.php

Codeigniter Download example source code

To run below examples,we have to load the URL helper by adding below line to controller constructor.

1

<?php $this->load->helper('url');?>

base_url() returns web site url.

1
2
3
4

<?php 
//output is http://example.com/
echo base_url();
?>

index_page() returns the index_page in config variable.by default it returns index.php. when you enable mod_write for Codeigniter index_page empty. Then base_url and site_url are equal.

1
2
3
4

<?php 
// out put could be index.php
echo index_page()
 ?>

site_url() return base_url with index_page in config variable. That is index.php by default.

1
2
3
4

  <?php 
//output could be http://example.com/index.php
echo site_url();
?>

site_url() takes two kinds of parameters either a string of segmets or array of segments.

Below example takes string of segments as a parameter.

1
2
3
4
5

<?php 
//output could be http://example.com/index.php/desired_controller/controller_method
echo site_url('/desired_controller/controller_method');
//out put could be http://example.com/index.php/desired_controller/controller_method/parameter1/parameter2 
echo site_url('/desired_controller/controller_method/parameter1/parameter2');?>

Below example takes array of segments as a parameter. be aware that precedence importence.

1
2
3
4

  <?php 
$segments=array('desired_controller','controller_method','parameter1','parameter2');
echo site_url($segments);
//out put could be http://example.com/index.php/desired_controller/controller_method/parameter1/parameter2 ?>

Codeigniter site folder structure

Here we use basic css back ground image to get rollover effect.the logic is simple and we can find it in comments in script itself.

• we create a empty link
• set back ground as test1.jpg and display to block and height and width to 150px.
• build a suido selctor hover to link and set back ground image to test2.jpg
• this works even javascript disabled browsers also

Download Script

image-rollover-css

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

<html>
<head>
<title>image rollover with css</title>
<style type="text/css">
<!--
#imagerollover a {
	background-image: url(test2.JPG);
	display: block;
	background-repeat: no-repeat;
	height: 150px;
	width: 150px;
}
#imagerollover a:hover{
	background-image: url(test1.JPG);
}
-->
</style>
</head>
<body>
<div id="imagerollover"><a href="#test">&nbsp;</a></a></div>
</body>
</html>

Download Script

image-rollover-css

CodeIgniter is a powerful PHP framework with a very small footprint,built for specially PHP coders.It has many advantages like SEF URL ,light weight, high level Security,MVC model ,more libraries .
But it has strictly followed SEF segments ,it unsets or delets the global $_GET array to prevent Security Hacks when it initializes .To Enable or Create Custom GET method
open config.php file in aplications/config/ folder

set uri protocal

 $config['uri_protocol']	= "PATH_INFO";

code sample

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

 
/*
|--------------------------------------------------------------------------
| URI PROTOCOL
|--------------------------------------------------------------------------
|
| This item determines which server global should be used to retrieve the
| URI string.  The default setting of "AUTO" works for most servers.
| If your links do not seem to work, try one of the other delicious flavors:
|
| 'AUTO'			Default - auto detects
| 'PATH_INFO'		Uses the PATH_INFO
| 'QUERY_STRING'	Uses the QUERY_STRING
| 'REQUEST_URI'		Uses the REQUEST_URI
| 'ORIG_PATH_INFO'	Uses the ORIG_PATH_INFO
|
*/
$config['uri_protocol']	= "PATH_INFO";

add a line of code in your control method to recreate the GET array
for example codeigniter default welcome.php controller in Codeigniter

1
2
3
4
5
6
7
8
9
10
11
12
13
14

class Welcome extends Controller {
 
	function Welcome()
	{
		parent::Controller();	
	}
 
	function index()
	{	
		parse_str($_SERVER['QUERY_STRING'],$_GET); //converts query string into global GET array variable
		print_r($_GET); //test the $_GET variables
		$this->load->view('welcome_message');
	}
}

if you run your code with following URL

http://localhost/index.php/welcome/?var1=1&var2=2&var3=3

The result will be

Array
(
    [var1] => 1
    [var2] => 2
    [var3] => 3
)

Here parse_str function converts string to array with given deliminator.To know more about parse_str go to php.net
Even though we can achieve this result, i suggest you to stick to segments because it more user friendly.