Автозаполнение с предложениями от сервера
Я хочу сделать автозаполнение, которое приносит предложения с сервера (предложения появятся после того, как вы напишите первую букву слова). На сервере слова находятся в базе данных (таблица со словами).
Я написал это для окна поиска
<!DOCTYPE html>
<html>
<head>
<script src="scriptaculous/lib/prototype.js" type="text/javascript"></script>
<script src="scriptaculous/src/scriptaculous.js" type="text/javascript"></script>
<style>
div#sugestii
{width:250px;border:1px solid red}
div#sugestii ul
{
list-style-type:none;
margin:0px;
padding:0px;
}
div#sugestii ul li.selected
{background-color:#ffb;}
div#sugestii ul li
{ cursor:pointer}
</style>
<script>
function initializare()
{
new Ajax.Autocompleter("tbox", "sugestii", "sugestii.php",{})
}
</script>
</head>
<body onload="initializare()" style="margin:0px">
Caseta de cautare:<br/>
<input type="text" id="tbox"/>
<div id="sugestii"></div>
</body>
</html>
И это sugestii.php
<?php
print '<ul><li>first suggestion</li><li>second suggestion</li><li>third suggestion</li></ul>';
?>
Моя проблема в том, что автозаполнение не работает, и я не знаю, что я делаю неправильно.
Решение
Давайте использовать хорошо сделанное решение, которое на самом деле работает: JQuery-UI автозаполнение:
прочтите документ, чтобы установить его, чтобы серверная сторона ждала параметр get с именем «term» и возвращала массив json (например, используя функцию json_encode для массива)
Буона Фортуна Амико Мио
Другие решения
Я думаю, что вы еще не указали событие.
Поскольку это поле ввода текста, вы можете указать событие, например onkeyup или onkeydown, и вызвать функцию, выполняющую автозаполнение scriptaculous (что немного странно)
так
{<input type="text" id="tbox" onkeyup="initializare()"/>}
Но, кстати, когда в производственной среде используют jquery