| это обычный инпуты с автодополнением.про них достаточно много написано как на форуме, так и в поисковике.
 
 Вкратце: на событие ввода символа отправляется запрос на сервер(если вариантов для автозаполнения мало, то можно и без сервера), в котором указана строка, которую ввел пользователь.
 Сервер в ответ выдает список предложений/продолжений, и поулчив его, вы рисуете DIV строго под инпутом, и заполняете присланными вариантами. на клик по варианту(также можно заюзать стелки клавиатуры и Enter), вы помещаете вариант в Input
 |