Подсказка вводимого города на сайте

28.11.2019

Довольно удобно, когда посетитель начинает вбивать название своего города, и ему выводится список и чем больше букв введено, тем список короче и конкретнее.

Для такого автокомплита городов, я решил использовать http://kladr-api.ru/, но стоит обратить внимание, что у бесплатной версии есть ограничение - первым пунктов в выпадающем списке будет Бесплатная версия kladr-api:

pic1

Детальнее можно ознакомиться по ссылке http://kladr-api.ru/prices

Основным плюсом является наличие уже готового плагина: https://github.com/garakh/kladrapi-jsclient, к сожалению в его примерах есть ошибки (вызов старых файлов и т.д.), поэтому ниже приведу пример минимально необходимого кода:

 
<link rel="stylesheet" type="text/css" href="/css/jquery.fias.min.css" media="all" />
<script src="/js/jquery.fias.min.js" type="text/javascript"></script>

<script>
(function($){
$(function() {
    $('[name="city"]').fias({
        type: $.fias.type.city,
        'withParents' : true
    });
});
})(jQuery);
</script>

<input type="text" name="city"  />

Еще есть старый плагин, который помечен как устаревший: https://github.com/fias-api/jquery (стоит отметить, что он тоже работает).


Категории: Web, JavaScript
Пометки: выбрать город из списка на сайт, autocomplete городов, КЛАДР, KLADR, автопредложение города
Яндекс.Метрика