Автозаполнение с элементом div'a?

Question

[oc1tane]

Друзья, хочу на свою страничку автозаполнения с элементом произвольного дива.
В дальнейшем хочу поля input подгружать станции метро из базы данных. Опыта не хватает, а все возможные twitter jquery не могут в полной возможности реализовать мою идею.
Вопрос, где можно почитать конкретно, как реализовать автокомплит с произвольным дивом (див нужен для иконки станции метро)

Answer 1

[Сергей Горностаев]

Сравнительно недавно делал похожее на jQuery UI Autocomplete


Необходимо переопределить метод _renderItem, отвечающий за формирование элементов выпадающего списка:

$('#search-query').autocomplete({ ... }).autocomplete("instance")._renderItem = function(ul, item) {
  var menuItem = $('<li>');
  if (item.icon)
    menuItem.append('<img src="' + item.icon + '">');
  else
    menuItem.append('<img src="/static/img/empty_64x64.png">');
  menuItem
    .append('<a href="' + item.url + '">' + shorten(item.label, 25) + '<br><span>' + shorten(item.desc, 80) + '</span></a>')
    .appendTo(ul);
  return menuItem;
};

Для простоты выбросил из примера ajax и категории https://jsfiddle.net/TheDeadOne/1Lox6x8f/

Comments

[oc1tane]

Спасибо огромное за пример