Jump to content

Simple Search on Ajax + PHP


mmy07

Recommended Posts

Listing. w_search.php

 

PHP:

<?php

error_reporting(E_WARNING);

require('T.MySQL.class.php'); // follow this link to donwload T.MySQL.class.php: http://www.phpclasses.org/browse/package/3886.html

 

// $t = null;

if (isset($_POST['text']))

{

$t = $_POST['text'];

$string = '';

$found = 1;

$sql = new TMySQL;

if( ($t != '') && (strlen($t) >= 2) )

{

$sql -> db_connect("localhost", "root", "", "yourDbName");

$sql -> query('SET NAMES utf8');

$res = $sql -> query("SELECT * FROM search WHERE `key` LIKE '%".$t."%' OR `description` LIKE '%".$t."%' ORDER BY `key` ASC");

for ($i = 0; $i < sizeof($res); $i++)

{

$string .= $found.'. <b>'.$res[$i]['key'].'</b><br>'.$res[$i]['description'].'<br>';

$found++;

}

}

else

$string = '';

echo $string;

}

?>

 

 

Listing. scripts.js

JavaScript:

function w_SearchText() {

var t = $('searchText').value;

var pars = $H({text:t}).toQueryString();

new Ajax.Updater("results", "w_search.php", {method:"post", parameters:pars});

}

 

 

 

 

 

Download: http://www.prototypejs.org/assets/2007/6/20/prototype.js

 

<script src="prototype.js" type="text/javascript"></script>

 

 

 

Listing. style.css

 

 

CSS:

body {

    background-color: #EDEDED;

    margin: 0;

    padding: 2em 2em 2em 2em;

}

 

#results {

    margin: 0em 0 0 0;

    background-color: #0099cc;

    font-size: 80%;

    font-family: Tahoma, sans-serif;

    color: #ffffff;

}

 

#block_ {

    position: absolute;

    left: 32px;

    top: 50px;

    background-repeat: no-repeat;

    width: 270px;

    height: 150px;

    z-index: 1;

}

 

 

 

 

 

Listing. index.html

 

 

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

<head>

<title>Simple Search Ajax (Prototype.js) + PHP by Minnur Yunusov</title>

<meta http-equiv="content-type" content="text/html; charset=Windows-1251" />

<link rel="stylesheet" type="text/css" href="styles.css" />

<script src="prototype.js" type="text/javascript"></script>

<script src="scripts.js" type="text/javascript"></script>

</head>

 

<body>

 

<form id="expForm" action="#" method="post">

<p>

 

 

 

<input type="text" name="searchText" id="searchText" rows="10" class="txt" onkeyup="w_SearchText()" >

 

<table width="330" id="block_" border="0" cellpadding="0" cellspacing="0">

<tr><td><div id="results"></div></td></tr>

</table>

 

</p>

</form>

 

</body>

</html>

Link to comment
https://forums.phpfreaks.com/topic/83331-simple-search-on-ajax-php/
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.