In this artcile am going to shows how to get search results using PHP and Jquery
Please share your comments and feedback.Thanks.
Live Demo
Download ScriptTable.sql
Create a table using the following sql comments.
--
-- Table structure for table `users`
--
CREATE TABLE IF NOT EXISTS `users` (
`userid` int(11) NOT NULL AUTO_INCREMENT,
`username` varchar(225) NOT NULL,
PRIMARY KEY (`userid`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;
--
-- Table structure for table `users`
--
CREATE TABLE IF NOT EXISTS `users` (
`userid` int(11) NOT NULL AUTO_INCREMENT,
`username` varchar(225) NOT NULL,
PRIMARY KEY (`userid`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;
Conn.php
<?php
$connection=mysql_connect("localhost","root","");
$db=mysql_select_db("database",$connection);
// Check connection
if (!$connection) {
die('Could not connect: ' . mysql_error());
}
?>
$connection=mysql_connect("localhost","root","");
$db=mysql_select_db("database",$connection);
// Check connection
if (!$connection) {
die('Could not connect: ' . mysql_error());
}
?>
Search.php
<?php $data='';
if(isset($_POST['search'])) {
$uname = $_POST['search'];
$uname = preg_replace("#[^0-9a-z]#i","",$uname);
$query = "select username from users where username LIKE '%$uname%'";
$result = mysql_query($query);
$count = mysql_num_rows($result);
if($count>0)
{
while($row = mysql_fetch_array($result))
{
$data = $data."<div>".$row['username']."</div>";
}
echo "<h1>Search results:</h1><br>";
echo $data;
}
}
else
{
?>
<html>
<head>
<title>PHP search using Ajax</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-git2.min.js" ></script>
<script type="text/javascript">
$(function(){
$('.search_results').keyup(function(){
var search = $('.search_results').val();
$.post("search.php",{"search":search},function(data){
$('.results').html(data);
});
});
});
</script>
</head>
<body>
<form action="search.php" method="post">
<input type="text" name="search" class="search_results" />
<input type="submit" value="search"/>
</form>
<div class="results"></div>
</body>
</html>
<?php
}
?>
if(isset($_POST['search'])) {
$uname = $_POST['search'];
$uname = preg_replace("#[^0-9a-z]#i","",$uname);
$query = "select username from users where username LIKE '%$uname%'";
$result = mysql_query($query);
$count = mysql_num_rows($result);
if($count>0)
{
while($row = mysql_fetch_array($result))
{
$data = $data."<div>".$row['username']."</div>";
}
echo "<h1>Search results:</h1><br>";
echo $data;
}
}
else
{
?>
<html>
<head>
<title>PHP search using Ajax</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-git2.min.js" ></script>
<script type="text/javascript">
$(function(){
$('.search_results').keyup(function(){
var search = $('.search_results').val();
$.post("search.php",{"search":search},function(data){
$('.results').html(data);
});
});
});
</script>
</head>
<body>
<form action="search.php" method="post">
<input type="text" name="search" class="search_results" />
<input type="submit" value="search"/>
</form>
<div class="results"></div>
</body>
</html>
<?php
}
?>
nice attempt but there are some flaws in your script need to improve
ReplyDelete
ReplyDeleteif
i put "abc" it gives those having "abc" (1 query fired)
again if i add "d" to search i,e "abcd" it gives those having "abcd" (Again query fires)
Is it right ?