Создать автозаполнение текстового поля с помощью ajax

Question

Я хочу создать автозаполнение текстового поля с помощью ajax. После написания какого-либо символа он вернет адрес электронной почты. Начиная с этих символов из БД. Это должно быть разработано в JSP. Может у кого есть идеи?

Answer 1

Я бы порекомендовал посмотреть на плагин автозаполнения , поставляемый с пользовательским интерфейсом jQuery.

Посмотрите их официальную демонстрацию , которая иллюстрирует, как она работает.

Answer 2

Вы смотрели на интеграцию jquery UI с вашим веб-приложением. Пользовательский интерфейс jquery имеет плагин автозаполнения / предложения http://docs.jquery.com/Plugins/autocomplete

Это ajax, и все, что вам нужно сделать, это просто предоставить список слов

Answer 3

Выполните следующие действия:

в javascript:

function getValue(str){
   if (window.XMLHttpRequest)
  {
  xmlhttp=new XMLHttpRequest();
  }
else
  {
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
url = url +"?" +str;
 xmlhttp.open("POST",url_to_get_db_data,false);
xmlhttp.send(null);
document.getElementById('id_of_div').innerHTML=xmlhttp.responseText;
document.getElementById('id_of_div').style.display = "block";
}

и в html:

<input onkeypress="getValue(this.value)"/>   //--- this will be your input text
<div id="id_of_div" style="display:none;">   //--- this is your autosuggest box which will appear down to textbox. Use css to show it at proper location.
</div>

отформатируйте ваш div так, чтобы он выглядел как поле с автопоставкойиспользуйте css для достижения этой цели.

Также, когда пользователь выбирает одну опцию из функции автозаполнения вызова ящика-скрипта, которая выполняет следующие действия: document.getElementById('id_of_div').style.display = "none";

Редактировать

на стороне сервера, когда вы получаете список базы данных, выполните следующие действия:

for(Iterator it=db_list.iterator();it.hasNext();)
    {
        Object obj = (Object) it.next();
        String value = obj.getValue();
        out.print(value+"<br>");
    }

Надеюсь, это поможет.