Ajax Search When textbox change (JQUERY + PHP)

It can make easy with jquery and php. Jqueyr also include ajax function and we can make easily that. First download jquery file from www.jquery.com. I made search.html and code is follwoing.

searching.html

[sourcecode lang=”xhtml”]<html> <head> <title>AJAX Search Simple</title> <script src=”jquery.js”></script> <script> $(document).ready(function() {

    $(“#q”).keyup(function(event){         value=$(this).val();         $(“#result”).html(“<b>Searching…</b>”);         $(“#result”).load(“result.php?data=”+value);     });

}); </script> </head> <body> <input type=”text” id=”q”> <div id=”result”></div> <body>

</html>[/sourcecode]

I am using keyup function for id q. ( #q mean id q that is textbox ) After keyup get value from text box and write text searching in result (div). I send query string to result.php. You will see result.php is following

result.php

[sourcecode lang=”php”] <?php //You can write some code in there. //Connect Database and make sql query in here echo “Search For “.$_GET[‘data’]; ?>[/sourcecode]

You should add some code in PHP for search in database. It’s a simple. You can download complete code in here.

comments powered byDisqus