---
metadata:
  - name: generator
    content: Diplodoc Platform v5.64.2
alternate:
  - https://yandex.com/dev/jsapi-v2-1/doc/ru/v2-1/dg/concepts/geocoding/suggest.md
  - href: https://yandex.com/dev/jsapi-v2-1/doc/ru/v2-1/dg/concepts/geocoding/suggest.md
    type: text/markdown
    title: Markdown version
  - href: https://yandex.com/dev/jsapi-v2-1/doc/ru/llms.txt?revision=r21950234
    rel: describedby
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.com/dev/jsapi-v2-1/doc/ru/llms.txt?revision=r21950234

# Поисковая строка вне карты


В SuggestView, который можно использовать для создания поисковых подсказок на странице. Такие поисковые подсказки используют ту же базу данных, что и подсказки при поиске на карте, либо информацию из заданного самостоятельно провайдера.

<!-- source: ru/_includes/2.1/terms/index.md -->
{% note warning %}

Чтобы использовать саджест в JS API:
1. [Получите ключ для саджеста](https://yandex.ru/dev/geosuggest/doc/ru/quickstart) в [Кабинете разработчика](https://developer.tech.yandex.ru/).
1. Укажите его при подключении JS API в формате `https://api-maps.yandex.ru/2.1/?lang=ru_RU&apikey=<ваш ключ для JS API>&suggest_apikey=<ваш ключ для Suggest API>`.

{% endnote %}
<!-- endsource: ru/_includes/2.1/terms/index.md -->

## Поисковая подсказка с данным Яндекс Карт {#search}

Чтобы добавить на страницу поисковую подсказку нужно:
1. Добавить элемент `input` с типом `text` на страницу:
2. 
    ```
    <input type="text" id="suggest">
    ```
    
3. [Подключить для страницы JSAPI карт](https://yandex.com/dev/jsapi-v2-1/doc/ru/v2-1/dg/concepts/load.md).
4. После загрузки API, создать элемент SuggestView и прикрепить его к HTML-элементу:
5. 
    ```
    ymaps.ready(init);
    
    function init() {
    var suggestView1 = new ymaps.SuggestView('suggest');
    }
    
    ```

При вводе текста в панель будут предлагаться поисковые подсказки.

## Поисковая подсказка со своими данными

Чтобы предоставить пользователям поиск по заранее заданным данным, нужно:
1. Создать массив, по которому будет производиться поиск:
    ```
    var arr = [
    "Москва",
    "Сочи",
    "Новгород"
    ];
    ```
    
1. Создать функцию, реализующую поиск по массиву:
    ```
    var find = function (arr, find) {
    return arr.filter(function (value) {
    return (value + "").toLowerCase().indexOf(find.toLowerCase()) != -1;
    });
    };
    ```
    
1. Создать провайдера поиска:
    ```
    var myProvider = {
    suggest: function (request, options) {
    var res = find(arr, request),
    arrayResult = [],
    results = Math.min(options.results, res.length);
    for (var i = 0; i < results; i++) {
    arrayResult.push({displayName: res[i], value: res[i]})
    }
    return ymaps.vow.resolve(arrayResult);
    }
    }
    ```
    
1. Создать элемент SuggestView, использующий провайдер поиска:
    ```
    var suggestView = new ymaps.SuggestView('suggest', {provider: myProvider, results: 3});
    ```

## Примеры в песочнице

- [Поисковая подсказка со своими данными](https://tech.yandex.ru/maps/jsbox/2.1/suggest)

- [Проверка введенного адреса доставки](https://tech.yandex.ru/maps/jsbox/2.1/input_validation)

