Postanowiłem w końcu zrobić wyszukiwarkę, która opierała by się na Ajax’ie i pobierała dane z MySQL. Pogooglowałem i wynalazłem coś takiego: searchautosuggest.zip. Postaram się teraz omówić co i jak trzeba skonfigurować aby działało poprawnie.

Krok 1.
Wklejamy pliki do naszego katalogu. Tworzymy plik w którym chcemy mieć ową wyszukiwarkę. I za pomocą funkcji include dodajemy autosuggest.php. Wygląda to tak:

Krok 2.
Zeby nasz skrypt łączył się z bazą danych musimy nadać mu odpowiednie wpisy w pliku config.php. Oto ten plik:

 PHP |  copy code |? 
<?php
// REQUIRED! Parameters to connecto to your DB
// CHANGE ONLY $db_host, $db_name, $username, $password
$db_host="host bazy danych";
$db_name="nazwa bazy";
$username="użytkownik";
$password="hasło";

Krok 3.
Teraz musimy określić co ma być pokazywane w naszej szukajce. Do ustawienie warunków wyszukiwania służy plik – search.php, a dokładniej ten fragment:
 PHP |  copy code |? 
	$SQL_FROM = 'skąd';
	$SQL_WHERE = 'co';

pierwsza opcja służy do określenia tabeli w bazie danych, natomiast druga do pola jakie ma być przeszukiwane. I teraz już pozostało nam określenie co będzie wyświetlane pod imputem. Robimy to zmieniając w lini 43 następujące wartości:
 PHP |  copy code |? 
	<li><a href="index.php?co=&lt;?php echo $row['co']; ?&gt;"> <small></small></a></li>
 

Wartość linku $row['co'] oznacz co będziemy przekazywać po naciśnięciu wybranego rekordu. Wartość $row['co pokaże'] pozwoli nam zmienić to co jest wyświetlane w z bazy w inpucie.

Krok 4 (opcjonalnie.
Wersja tej wyszukiwarki pozwala nam zmieniać wygląd. Aby zmienić wygląd (kolor, rozmiar czcionki, etc…) otwieramy plik autosuggest.php i w tym właśnie plik zmieniamy styl CSS w liniach:

 CSS |  copy code |? 
/* CUSTOMIZE AUTOSUGGEST STYLE	*/
#search-wrap input{width:400px; font-size:16px; color:#999999; padding:6px; border:solid 1px #999999;}
#results{width:260px; border:solid 1px #DEDEDE; display:none;}
#results ul, #results li{padding:0; margin:0; border:0; list-style:none;}
#results li {border-top:solid 1px #DEDEDE;}
#results li a{background:#EEEEEE; display:block; padding:4px; text-decoration:none; color:#000000; font-weight:bold;}
#results li a small{display:block; text-decoration:none; color:#999999; font-weight:normal;}
#results li a:hover{background:#ffcc99;}
#results ul {padding:6px;}

To już wszystko teraz możemy cieszyć się wyszukiwaniem w bazie danych.

Piotrek