[Web-development (jquery)] PHP, jQuery and MySQL Search

PHP, jQuery and MySQL Search

 //index.html <style> body{ font-family:Arial, Helvetica, sans-serif; } *{ margin:0;padding:0; } #container { margin: 0 auto; width: 600px; } a { color:#DF3D82; text-decoration:none } a:hover { color:#DF3D82; text-decoration:underline; } ul.update { list-style:none;font-size:1.1em; margin-top:10px } ul.update li{ height:30px; border-bottom:#dedede solid 1px; text-align:left;} ul.update li:first-child{ border-top:#dedede solid 1px; height:30px; text-align:left; } #flash { margin-top:20px; text-align:left; } #searchresults { text-align:left; margin-top:20px; display:none; font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#000; } .word { font-weight:bold; color:#000000; } #search_box { padding:4px; border:solid 1px #666666; width:300px; height:30px; font-size:18px;-moz-border-radius: 6px;-webkit-border-radius: 6px; } .search_button { border:#000000 solid 1px; padding: 6px; color:#000; font-weight:bold; font-size:16px;-moz-border-radius: 6px;-webkit-border-radius: 6px; } .found { font-weight: bold; font-style: italic; color: #ff0000; } h2 { margin-right: 70px; } </style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript"> $(function() { $(".search_button").click(function() { // getting the value that user typed var searchString = $("#search_box").val(); // forming the queryString var data = 'search='+ searchString; // if searchString is not empty if(searchString) { // ajax call $.ajax({ type: "POST", url: "do_search.php", data: data, beforeSend: function(html) { // this happens before actual call $("#results").html(''); $("#searchresults").show(); $(".word").html(searchString); }, success: function(html){ // this happens after we get results $("#results").show(); $("#results").append(html); } }); } return false; }); }); </script> <div> <div> <form method="post" action="do_search.php"> <input type="text" name="search"/> <input type="submit" value="Search" /><br /> </form> </div> <div> <div>Search results :</div> <ul> </ul> </div> </div> 

 //do_search.php <?php //if we got something through $_POST if (isset($_POST['search'])) { // here you would normally include some database connection include('db.php'); $db = new db(); // never trust what user wrote! We must ALWAYS sanitize user input $word = mysql_real_escape_string($_POST['search']); $word = htmlentities($word); // build your search query to the database $sql = "SELECT title, url FROM pages WHERE content LIKE '%" . $word . "%' ORDER BY title LIMIT 10"; // get results $row = $db->select_list($sql); if(count($row)) { $end_result = ''; foreach($row as $r) { $result = $r['title']; // we will use this to bold the search word in result $bold = '<span>' . $word . '</span>'; $end_result .= '<li>' . str_ireplace($word, $bold, $result) . '</li>'; } echo $end_result; } else { echo '<li>No results found</li>'; } } ?> 

source : http://docstoc.com, http://flickr.com, http://tutorial101.blogspot.com

Posted by Unknown