CodeIgniter Tutorial for Beginners<\/a><\/span><\/p>\nThe example code initially displays all countries in the country dropdown. When a country is selected, the respective states will be fetched from the MySQL database and appear in the state dropdown. Alike, when a state is selected, the respective cities will be fetched from the MySQL database and appear in the city dropdown.<\/p>\n
Create Database Tables<\/h2>\n
To store the data of country, state, and city, three tables need to be created in the database. Also, there would be a relationship between countries, states, and cities table. The states table has a relation with countries table and cities table has a relation with states table.<\/p>\n
Countries Table:<\/b>
\nThe following SQL creates a countries<\/code> table in the MySQL database.<\/p>\nCREATE<\/span> TABLE<\/span> `countries<\/span>` (\r\n `id`<\/span> int<\/span>(11<\/span>) NOT NULL<\/span> AUTO_INCREMENT,\r\n `name`<\/span> varchar<\/span>(50<\/span>) CHARACTER SET<\/span> utf8 NOT NULL<\/span>,\r\n `status`<\/span> enum('1'<\/span>,'0'<\/span>) COLLATE utf8_unicode_ci NOT NULL<\/span> DEFAULT '1'<\/span> COMMENT '0:Blocked, 1:Active'<\/span>,\r\n PRIMARY KEY<\/span> (`id`<\/span>)\r\n) ENGINE=<\/span>InnoDB DEFAULT CHARSET=<\/span>utf8 COLLATE=<\/span>utf8_unicode_ci;\r\n<\/pre>\nStates Table:<\/b>
\nThe following SQL creates a states<\/code> table in the MySQL database.<\/p>\nCREATE<\/span> TABLE<\/span> `states<\/span>` (\r\n `id`<\/span> int<\/span>(11<\/span>) NOT NULL<\/span> AUTO_INCREMENT,\r\n `country_id`<\/span> int<\/span>(11<\/span>) NOT NULL<\/span>,\r\n `name`<\/span> varchar<\/span>(50<\/span>) COLLATE utf8_unicode_ci NOT NULL<\/span>,\r\n `status`<\/span> enum('1'<\/span>,'0'<\/span>) COLLATE utf8_unicode_ci NOT NULL<\/span> DEFAULT '1'<\/span> COMMENT '0:Blocked, 1:Active'<\/span>,\r\n PRIMARY KEY<\/span> (`id`<\/span>)\r\n) ENGINE=<\/span>InnoDB DEFAULT CHARSET=<\/span>utf8 COLLATE=<\/span>utf8_unicode_ci;\r\n<\/pre>\nCities Table:<\/b>
\nThe following SQL creates a cities<\/code> table in the MySQL database.<\/p>\nCREATE<\/span> TABLE<\/span> `cities<\/span>` (\r\n `id`<\/span> int<\/span>(11<\/span>) NOT NULL<\/span> AUTO_INCREMENT,\r\n `state_id`<\/span> int<\/span>(11<\/span>) NOT NULL<\/span>,\r\n `name`<\/span> varchar<\/span>(50<\/span>) COLLATE utf8_unicode_ci NOT NULL<\/span>,\r\n `status`<\/span> enum('1'<\/span>,'0'<\/span>) COLLATE utf8_unicode_ci NOT NULL<\/span> DEFAULT '1'<\/span> COMMENT '0:Blocked, 1:Active'<\/span>,\r\n PRIMARY KEY<\/span> (`id`<\/span>)\r\n) ENGINE=<\/span>InnoDB DEFAULT CHARSET=<\/span>utf8 COLLATE=<\/span>utf8_unicode_ci;\r\n<\/pre>\n<\/span>Dynamic Dependent Select Box using jQuery, Ajax and PHP<\/a><\/span><\/p>\nController (Dropdowns.php)<\/h2>\n
The Dropdowns controller contains 4 functions, __construct(), index(), getStates(), and getCities().<\/p>\n
\n__construct()<\/code> – Loads the Dropdown model.<\/li>\nindex()<\/code> – All the country data is retrieved from the database using Dropdown model and pass data to the view.<\/li>\ngetStates()<\/code> – Bases on the country ID the state data is retrieved from the database using Dropdown model and render data in JSON format.<\/li>\ngetCities()<\/code> – Bases on the state ID the city data is retrieved from the database using Dropdown model and render data in JSON format.<\/li>\n<\/ul>\n<?php <\/span>if ( ! <\/span>defined<\/span>(<\/span>'BASEPATH'<\/span>)) exit(<\/span>'No direct script access allowed'<\/span>);
class <\/span>Dropdowns <\/span>extends <\/span>CI_Controller <\/span>{
function <\/span>__construct<\/span>() {
<\/span>parent<\/span>::<\/span>__construct<\/span>();
<\/span>$this<\/span>-><\/span>load<\/span>-><\/span>model<\/span>(<\/span>'dropdown'<\/span>);
}
public function <\/span>index<\/span>(){
<\/span>$data<\/span>[<\/span>'countries'<\/span>] = <\/span>$this<\/span>-><\/span>dropdown<\/span>-><\/span>getCountryRows<\/span>();
<\/span>$this<\/span>-><\/span>load<\/span>-><\/span>view<\/span>(<\/span>'dropdowns\/index'<\/span>, <\/span>$data<\/span>);
}
public function <\/span>getStates<\/span>(){
<\/span>$states <\/span>= array();
<\/span>$country_id <\/span>= <\/span>$this<\/span>-><\/span>input<\/span>-><\/span>post<\/span>(<\/span>'country_id'<\/span>);
if(<\/span>$country_id<\/span>){
<\/span>$con<\/span>[<\/span>'conditions'<\/span>] = array(<\/span>'country_id'<\/span>=><\/span>$country_id<\/span>);
<\/span>$states <\/span>= <\/span>$this<\/span>-><\/span>dropdown<\/span>-><\/span>getStateRows<\/span>(<\/span>$con<\/span>);
}
echo <\/span>json_encode<\/span>(<\/span>$states<\/span>);
}
public function <\/span>getCities<\/span>(){
<\/span>$cities <\/span>= array();
<\/span>$state_id <\/span>= <\/span>$this<\/span>-><\/span>input<\/span>-><\/span>post<\/span>(<\/span>'state_id'<\/span>);
if(<\/span>$state_id<\/span>){
<\/span>$con<\/span>[<\/span>'conditions'<\/span>] = array(<\/span>'state_id'<\/span>=><\/span>$state_id<\/span>);
<\/span>$cities <\/span>= <\/span>$this<\/span>-><\/span>dropdown<\/span>-><\/span>getCityRows<\/span>(<\/span>$con<\/span>);
}
echo <\/span>json_encode<\/span>(<\/span>$cities<\/span>);
}
}<\/span><\/pre>\nModel (Dropdown.php)<\/h2>\n
The Dropdown model contains 4 functions, __construct(), getCountryRows(), getStateRows(), and getCityRows().<\/p>\n
\n__construct()<\/code> – Defines database tables for country, state, and city.\ngetCountryRows()<\/code> – Fetch country data from the database and return the rows based on the conditions provided by the $params array.\ngetStateRows()<\/code> – Fetch state data from the database and return the rows based on the conditions provided by the $params array.\ngetCityRows()<\/code> – Fetch city data from the database and return the rows based on the conditions provided by the $params array.\n<\/ul>\n<?php <\/span>if ( ! <\/span>defined<\/span>(<\/span>'BASEPATH'<\/span>)) exit(<\/span>'No direct script access allowed'<\/span>);
class <\/span>Dropdown <\/span>extends <\/span>CI_Model<\/span>{
function <\/span>__construct<\/span>() {
<\/span>$this<\/span>-><\/span>countryTbl <\/span>