これを実現するためにAJAXを使用できます。検索ボックスに現在入力されている文字に基づいてデータベースを簡単に呼び出す小さなPHPスクリプトを記述し、AJAXを使用してそれを呼び出して検索ボックスに入力することができます。それはサイトの目的ではないので、私はあなたのために全部を書き出すつもりはありませんが、あなたはここから始めることができます。このようなもののためのチュートリアルもオンラインでたくさんあります。
AJAX:
function getXmlHttpRequestObject() {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
} else if(window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
} else {
alert("Your browser does not support AJAX, please upgrade.");
}
}
//Create XMLHTTPRequest Object
var searchEntry = getXmlHttpRequestObject();
//Send AJAX request, do something when it sends a response
function searchSuggest() {
if (searchReq.readyState == 4 || searchReq.readyState == 0) {
var str = document.getElementById('insertsearchboxidhere').value;
searchEntry.open("GET", 'yourphpscript.php?search=' + str, true);
searchEntry.onreadystatechange = doSearchStuff();
searchEntry.send(null);
}
}
//Function that does the work with the response
function doSearchStuff() {
if (searchReq.readyState == 4) {
var str = searchEntry.responseText;
//Set innerHTML of your stuff to str, whatever else you want
}
}
PHP:明らかに、以下のコード以上のものが必要になりますが、現在検索ボックスに入力されている文字で始まるエントリをデータベースから返すことで、作業の大部分が実行されます。あなたは残りを理解することができます。
$query = "Select distinct(x) from (y) where x like '(z)%'";
x =フィールド、y =テーブル、z=AJAX経由で送信した変数
これは、更新する検索ボックスを構築するのに十分すぎるはずです。