Jun

Ajax Tutorial: Dynamic Loading of ComboBox using jQuery and Ajax in PHP

ZeeShaN

AJAX, JQuery, PHP, Web Development Tags

ajax tutorial, JQuery

Here is a script for beginners to create a dynamic loading of dropdown. Simple solution which is created by jQuery.

PART TWO IS HERE

Table Structure

CREATE TABLE IF NOT EXISTS `ajax_categories` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `category` varchar(50) NOT NULL,
  `pid` int(11) NOT NULL,
  PRIMARY KEY (`id`)
)

get_child_categoires.php

<?php
if($_REQUEST)
{
	$id 	= $_REQUEST['parent_id'];
	$query = "select * from ajax_categories where pid = ".$id;
	$results = mysql_query( $query);?>
 
	<select name="sub_category"  id="sub_category_id">
	<option value="" selected="selected"></option>
	<?php
	while ($rows = mysql_fetch_assoc(@$results))
	{?>
		<option value="<?php echo $rows['category'];?>  ID=<?php echo $rows['id'];?>"><?php echo $rows['category'];?></option>
	<?php
	}?>
	</select>	
 
<?php	
}?>

HTML

<div class="both">
	<h4>Select Category</h4>
	<select name="search_category"  id="search_category_id">
	<option value="" selected="selected"></option>
	<?php
	$query = "select * from ajax_categories where pid = 0";
	$results = mysql_query($query);
 
	while ($rows = mysql_fetch_assoc(@$results))
	{?>
		<option value="<?php echo $rows['id'];?>"><?php echo $rows['category'];?></option>
	<?php
	}?>
	</select>		
</div>
 
<div class="both">
	<h4 id="show_heading">Select Sub Category</h4>
	<div id="show_sub_categories" align="center">
		<img src="loader.gif" style="margin-top:8px; float:left" id="loader" alt="" />
	</div>
</div>

Written by ZeeShaN

ZeeShaN RasooL is a web developer who loves to work in latest technologies to create more interactive dynamic and beautiful web pages.

Most recent

Most liked

Show all comments (52)

absfrm

thanks a lot.
How can i get sub categories of child?
ex: after select main cat , next combobox show me children’s of it.and how can i show children’s of selected child in combobox?

please help me.thanks

April 30 2012

Comments Like

0 people liked this

venky

hi ,thanks, i need to do styles for this select box, it possible?? any tutorial for tht??

February 27 2012

Comments Like

0 people liked this

Simon

love it

January 23 2012

Comments Like

0 people liked this

Ladres

Hi,
Thank you so much, but I have to ask;

If I use 2 tables in one SQL database, how can we coding?..
For example;
First combo will use table1 data (id1, categori1, pid1)
Second combo will use table2 data (id2, categori2, pid2)

How can we connect these two tables?

Thank you so much.

December 07 2011

Comments Like

1 people liked this