---
metadata:
  - name: generator
    content: Diplodoc Platform v5.39.1
alternate:
  - https://yandex.com/dev/jsapi-v2-1/doc/ru/v2-1/dg/concepts/geocoding/suggest.md
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.com/dev/jsapi-v2-1/doc/ru/llms.txt

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


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

{% include [include](../../../../_includes/2.1/terms/index-47b676c75e05.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)