Build a website fast with GoDaddy.com! - 125x125
Jun
6

Ajax Tutorial: How to Create Ajax Search Using PHP jQuery and MYSQL

Author ZeeShaN    Category AJAX, JQuery, PHP, Web Development     Tags


This tutorial shows how to create simple and attractive Ajax based search using PHP, jQuery, MySQL and Ajax.

Table Structure:

1
2
3
4
5
6

CREATE TABLE `search` (
  `id` int(11) NOT NULL auto_increment,
  `text` varchar(255) NOT NULL,
  `link` varchar(255) NOT NULL,
  PRIMARY KEY  (`id`)
)

Javascript Code:

1
2
3
4
5
6
7
8

$(".searchBtn").click(function(){
	//show the loading bar
	showLoader();
	$('#sub_cont').fadeIn(1500);
 
	$("#content #sub_cont").load("search.php?val=" + $("#search").val(), hideLoader());
 
});

HTML

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

<div class="textBox">
        <input type="text" value="" maxlength="100" name="searchBox" id="search">
	<div class="searchBtn">
	&nbsp;
       </div>
</div>
<br clear="all" />
<div id="content">
	<div class="search-background">
	<label><img src="loader.gif" alt="" /></label>
	</div>
	<div id="sub_cont">	
	</div>
</div>

PHP Code

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

include("dbcon.php");
$rec = $_REQUEST['val'];
 
//get table contents
if($_REQUEST['val'])
{
	$sql = "select * from search where text like '%$rec%'";
}
else
{
	$sql = "select * from search ";
}
 
$rsd = mysql_query($sql);
$total =  mysql_num_rows($rsd);

Add To Facebook Stumble This Digg This Add To Del.icio.us Add To Reddit Add To Yahoo Add To Twitter


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.

8 to “Ajax Tutorial: How to Create Ajax Search Using PHP jQuery and MYSQL”

Post comment



Enter your Email:

Click Here for Popular

Who Am I

Zeeshan Rasool

Software Engineer - PHP
Lahore - Pakistan
Skype: zeeshan-rasool
gTalk: zishan.rasool85

Categories

Archives

Tags

99points adobe AJAX ajax pagination ajax rating ajax tutorial captcha Codeigniter codeigniter 2.0 codeigniter recaptcha CSS css tutorials curl dreamweaver cs5 Facebook Facebook. PHP. JQuery facebox farmville ffmpeg flv google api hacking image gallery Joomla JQuery jQuery Sliding Jquery tutorial mafia war Mootools MySQL Payment PHP php curl Poll System recaptcha RSS Feed SEO simplepie socail networking ssl Tutorials Twitter Web XSS youtube

Comments