SuggestView

Warning

To use a suggest in JS API:

  1. Get the key for the suggest in the developer's dashboard.
  2. Specify it when connecting the JS API in the format https://api-maps.yandex.ru/2.1/?lang=ru_RU&apikey=<your key for JS API>&suggest_apikey=<your key for Suggest API>.

Extends ICustomizable, IEventEmitter.

Creates a drop-down list with search suggestions and attaches it to the HTML element <input type="text">.

Constructor | Fields | Events | Methods

Constructor

SuggestView(element[, options])

Parameters:

Parameter

Default value

Description

element*

Type: HTMLElement|String

HTML element or its ID.

options

Type: Object

Options.

options.boundedBy

Type: Number[][]

A rectangular area on the map, where the object being searched for is presumably located. Must be set as an array, such as [[30, 40], [50, 50]].

options.container

Type: HTMLElement

HTML element for placing the display of the suggestions panel. If omitted, the suggestions panel is added to the parent of the HTML "input" element that it is created for.

options.layout

'islands#suggestView'

Type: String|ISuggestViewLayout

Panel layout.

The layout constructor is passed an object containing the fields:

  • suggestView - Link to the panel with search suggestions.
  • options - Options manager for the control suggestView.options.
  • state - State manager for the control suggestView.state.

The layout adapts its appearance based on the state and options of the suggestions panel. The control, in turn, reacts to layout interface events and changes the values of fields for suggestView.state depending on the commands received.

options.offset

Type: Number[]

Offsets of the suggestions panel from its default location (by default, the suggestions panel is attached to the lower edge of the "input" element and has the same width as it). Set as horizontal and vertical offsets relative to the lower-left corner of the "input" element.

options.provider

"yandex#map"

Type: String|ISuggestProvider

Provider for search suggestions. May be set as an object implementing the ISuggestProvider interface, or the standard value "yandex#map".

options.results

5

Type: Number

Maximum quantity of suggestions to display.

options.width

Type: Number

Width of the suggestions panel. By default, the same as the width of the HTML "input" element to which the panel is attached.

options.zIndex

40000

Type: Number

The z-index for the dom element of the suggestions panel.

* Mandatory parameter/option.

Examples:

1.

<input type="text" id="suggest"/>
<script src="//api-maps.yandex.ru/2.1/?lang=ru_RU&amp;load=SuggestView&amp;onload=onLoad"></script>
<script>
function onLoad (ymaps) {
    var suggestView = new ymaps.SuggestView('suggest');
}
</script>

2.

<input type="text" id="suggest"/>
<script src="//api-maps.yandex.ru/2.1/?lang=ru_RU&amp;load=SuggestView&amp;onload=onLoad"></script>
<script>
function onLoad (ymaps) {
    var suggestView = new ymaps.SuggestView('suggest', {results: 1, offset: [20, 30]});
}
</script>

Fields

Name

Type

Description

events

IEventManager

Event manager.

Inherited from IEventEmitter.

options

IOptionManager

Options manager.

Inherited from ICustomizable.

state

data.Manager

State of the search suggestions panel. Names of fields that are available via the data.Manager.get method:

  • request: String — Current active request.
  • items: Object[] - Array of search suggestions (objects with the value and displayName fields).
  • activeIndex: Number|null - Index of the currently active suggestion selected by the user with the mouse or keyboard, or null, if none of the suggestions is active.
  • panelClosed: Boolean - Indicates whether the user closed the panel by pressing ESC or choosing one of the suggestions.

Events

Name

Description

optionschange

Change to the object options.

Inherited from ICustomizable.

select

The user selected one of the search suggestions. Names of fields that are available via the Event.get method

  • item – A search suggestion (an object with the "displayName" and "value" fields).

Methods

Name

Returns

Description

destroy()

Destroys the search suggestions panel.

Fields details

state

{data.Manager} state

State of the search suggestions panel. Names of fields that are available via the data.Manager.get method:

  • request: String — Current active request.
  • items: Object[] - Array of search suggestions (objects with the value and displayName fields).
  • activeIndex: Number|null - Index of the currently active suggestion selected by the user with the mouse or keyboard, or null, if none of the suggestions is active.
  • panelClosed: Boolean - Indicates whether the user closed the panel by pressing ESC or choosing one of the suggestions.

Events details

select

The user selected one of the search suggestions. Names of fields that are available via the Event.get method

  • item – A search suggestion (an object with the "displayName" and "value" fields).

Methods details

destroy

{} destroy()

Destroys the search suggestions panel.