Country State City Dropdown in PHP

PHP Tutorials By vineet Kumar Saini
www.vineetsaini.wordpress.com
Country State City in Dropdown list in PHP using Ajax
First of all we create a database then we will create three tables in databse i.e. country ,
state and city table. Like as following images.
Country Table
CREATE TABLE `country` (
`Country_Id` varchar(255) NOT NULL,
`CountryName` varchar(255) NOT NULL
);
INSERT INTO `country` (`Country_Id`, `CountryName`) VALUES
('1', 'India'),
('2', 'Usa'),
('3', 'Canada');
State Table
CREATE TABLE `state` (
`StateId` varchar(255) NOT NULL,
`Country_Id` int(11) NOT NULL,
`StateName` varchar(255) NOT NULL
);
INSERT INTO `state` (`StateId`, `Country_Id`, `StateName`) VALUES
('1', 1, 'Orissa'),
('2', 1, 'Andhra Pradesh'),
('3', 1, 'West Bengal'),
('4', 1, 'Maharastra'),
('5', 2, 'Arizona'),
('6', 2, 'California'),
('7', 2, 'Texas'),
('8', 3, 'Alberta'),
('9', 3, 'Ontario');

City Table
CREATE TABLE `city` (
`CityId` varchar(255) NOT NULL,
`State_Id` int(11) NOT NULL,
`CityName` varchar(255) NOT NULL
) ENGINE=MyISAM DEFAULT CHARSET=latin1;
INSERT INTO `city` (`CityId`, `State_Id`, `CityName`) VALUES
('1', 1, 'Bhubaneswar'),
('2', 2, 'Hyderbad'),
('3', 3, 'Kolkata'),
('4', 4, 'Mumbai'),
('5', 5, 'Calgary'),
('6', 5, 'Edmonton'),
('7', 5, 'Duffield'),
('8', 6, 'Phoenix'),
('9', 7, 'San Diego'),
('10', 8, 'Austin'),
('11', 9, 'Toronto');

Now we will create configuration file in php i.e. config.php. I which file we will create the
database connectivity.
config.php file
<?php
$host="localhost";
$username="root";
$password="";
$dbname="country_dropdown";
$con=mysql_connect("$host","$username","$password");
mysql_select_db("$dbname",$con);
?>
Now we will create index.php
Index.php
<?php
include('config.php');
$Country_query="select id,country_name from country order by country_name asc ";
$Country=mysql_query($Country_query);
$Count_Country=mysql_num_rows($Country);
?>
<html>
<head>
<title>Country State City Drop Down Using Ajax in PHP</title>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"
type="text/javascript">
<script type="text/javascript">
function selectCity(country_id){
if(country_id!="-1"){
loadData('state',country_id);
$("#city_dropdown").html("<option value='-1'>Select city</option>");
}else{
$("#state_dropdown").html("<option value='-1'>Select state</option>");
$("#city_dropdown").html("<option value='-1'>Select city</option>");
}
}
function selectState(state_id){
if(state_id!="-1"){
loadData('city',state_id);
}else{
$("#city_dropdown").html("<option value='-1'>Select city</option>")
}
}
function loadData(loadType,loadId){
var dataString = 'loadType='+ loadType +'&loadId='+ loadId;

$.ajax({
type: "POST",
url: " load_state_city.php",
data: dataString,
cache: false,
success: function(result){
$("#"+loadType+"_loader").hide();
$("#"+loadType+"_dropdown").html("<option value='-1'>Select
+loadType+"</option>");
$("#"+loadType+"_dropdown").append(result);
}
});
}
</script>
</head>
<body>
<?php
if($Count_Country > 0){
?>
<table>
<tr>
<td>Country:</td>
<td>
<select onchange="selectCity(this.options[this.selectedIndex].value)">
<option value="-1">Select country</option>
<?php
while($rowCountry=mysql_fetch_array($Country)){
?>
<option value="<?php echo $rowCountry['id']?>"><?php echo
$rowCountry['country_name']?></option>
<?php
}
?>
</select>
</td>
</tr>
<tr>
<td>State:</td>
<td>
<select id="state_dropdown"
onchange="selectState(this.options[this.selectedIndex].value)">
<option value="-1">Select state</option>
</select><span id="state_loader"></span>
</td>
</tr>
<tr>
<td>City:</td>
<td>

<select id="city_dropdown">
<option value="-1">Select city</option>
</select><span id="city_loader"></span>
</td>
</tr>
</table>
<?php
}else{
echo 'No Country Name Found';
}
?>
</body>
</html>
load_state_city.php
<?php
include('config.php');
$loadType=$_POST['loadType'];
$loadId=$_POST['loadId'];
if($loadType=="state"){
$sql="select id,state_name from state where country_id='".$loadId."' order by
state_name asc";
}else{
$sql="select id,city_name from city where state_id='".$loadId."' order by
city_name asc";
}
$res=mysql_query($sql);
$check=mysql_num_rows($res);
if($check > 0){
$HTML="";
while($row=mysql_fetch_array($res)){
$HTML.="<option value='".$row['id']."'>".$row['1']."</option>";
}
echo $HTML;
}
?>
Output
When we run the index.php file then we will get following output. Suppose we select
Canada from country dropdown then display state in state dropdown along with Canada.
When we select state from state dropdown then city will display in city dropdown along
with selected state.

.1 .2
.3 .4
Conclusion
Using this article one can get easily understand cascading dropdown list in php.

Country State City Dropdown in PHP

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (7)

Similar to Country State City Dropdown in PHP

Similar to Country State City Dropdown in PHP (20)

More from Vineet Kumar Saini

More from Vineet Kumar Saini (20)

Recently uploaded

Recently uploaded (20)

Country State City Dropdown in PHP