control.ListBox
Расширяет control.Group.
Класс для создания элемента управления в виде раскрывающегося списка.
Конструктор | Поля | События | Методы
Конструктор
Параметры:
Параметр | Значение по умолчанию | Описание |
---|---|---|
params | — | Тип: Object Параметры элемента управления. |
params.data | — | Тип: Object Данные. |
params.data.title | — | Тип: String Заголовок списка. |
params.items | — | Тип: IControl[] Пункты списка. |
options | — | Тип: Object Опции элемента управления. |
options.collapseTimeout | 3000 | Тип: Number Временной интервал, по истечении которого раскрытый список автоматически закрывается. |
options.expandOnClick | true | Тип: Boolean Флаг, разрешающий автоматическое разворачивание/сворачивание списка по клику. |
options.layout | — | Тип: Function|String Макет элемента управления.
В конструктор макета передается объект, содержащий поля:
|
options.minWidth | 0 | Тип: Number Минимальная ширина выпадающего списка. |
options.position | { top: 5, left: 5 } | Тип: Object Положение элемента управления над картой.
Задается в виде объекта со следующими полями:
|
options.visible | true | Тип: Boolean Признак того, что элемент управления отображается. |
Параметр | Значение по умолчанию | Описание |
---|---|---|
params | — | Тип: Object Параметры элемента управления. |
params.data | — | Тип: Object Данные. |
params.data.title | — | Тип: String Заголовок списка. |
params.items | — | Тип: IControl[] Пункты списка. |
options | — | Тип: Object Опции элемента управления. |
options.collapseTimeout | 3000 | Тип: Number Временной интервал, по истечении которого раскрытый список автоматически закрывается. |
options.expandOnClick | true | Тип: Boolean Флаг, разрешающий автоматическое разворачивание/сворачивание списка по клику. |
options.layout | — | Тип: Function|String Макет элемента управления.
В конструктор макета передается объект, содержащий поля:
|
options.minWidth | 0 | Тип: Number Минимальная ширина выпадающего списка. |
options.position | { top: 5, left: 5 } | Тип: Object Положение элемента управления над картой.
Задается в виде объекта со следующими полями:
|
options.visible | true | Тип: Boolean Признак того, что элемент управления отображается. |
Примеры:
1.
// Пример 1.
// Обработка клика на элементах списка.
var cityList = new ymaps.control.ListBox({
data: {
title: 'Выбрать город'
},
items: [
new ymaps.control.ListBoxItem({data: {content: 'Москва'}}),
new ymaps.control.ListBoxItem({data: {content: 'Новосибирск'}}),
new ymaps.control.ListBoxSeparator(),
new ymaps.control.ListBoxItem({data: {content: 'Нью-Йорк'}}),
]
});
cityList.get(0).events.add('click', function () {
map.setCenter([55.752736, 37.606815]);
});
cityList.get(1).events.add('click', function () {
map.setCenter([55.026366, 82.907803]);
});
cityList.get(3).events.add('click', function () {
map.setCenter([40.695537, -73.97552]);
});
map.controls.add(cityList);
2.
// Пример 2.
// Создание пользовательского списка.
// В примере используется jQuery, загруженный с http://yandex.st/jquery/1.6.4/jquery.min.js
// Выпадающий список по умолчанию реагирует на события 'click' и автоматически
// меняет состояние на развернутое или свернутое.
var MyListBoxLayout = ymaps.templateLayoutFactory.createClass(
"<div id='my-listbox-header' >$[data.title]</div >" +
// Этот элемент будет служить контейнером для дочерних элементов списка.
"<div id='my-list-box' [if state.expanded]style='display: block;'[else]style='display: none;'[endif] >" +
"</div >", {
build: function() {
MyListBoxLayout.superclass.build.call(this);
this.childContainerElement = $('#my-list-box').get(0);
// Каждый раз при перестроении будем генерировать событие,
// сигнализирующее о смене контейнера для дочерних элементов.
// Формат события описан в интерфейсе IGroupControlLayout.
this.events.fire('childcontainerchange', {
newChildContainerElement: this.childContainerElement,
oldChildContainerElement: null
});
},
// Переопределим метод, который требует интерфейс IGroupControlLayout.
getChildContainerElement: function () {
return this.childContainerElement;
}
}),
// Создадим список и выставим созданный макет через опции.
listBox = new ymaps.control.ListBox({}, {layout: MyListBoxLayout});
Поля
Имя | Тип | Описание |
---|---|---|
data | data.Manager | Данные выпадающего списка.
Имена полей, доступных через метод data.Manager.get:
|
events | IEventManager | Менеджер событий. Унаследовано от IEventEmitter. |
options | IOptionManager | Менеджер опций. Унаследовано от ICustomizable. |
state | data.Manager | Состояние выпадающего списка.
Имена полей, доступных через метод data.Manager.get:
|
Имя | Тип | Описание |
---|---|---|
data | data.Manager | Данные выпадающего списка.
Имена полей, доступных через метод data.Manager.get:
|
events | IEventManager | Менеджер событий. Унаследовано от IEventEmitter. |
options | IOptionManager | Менеджер опций. Унаследовано от ICustomizable. |
state | data.Manager | Состояние выпадающего списка.
Имена полей, доступных через метод data.Manager.get:
|
События
Имя | Описание |
---|---|
add | Произошло добавление дочернего объекта. Унаследовано от ICollection. |
childcontainerchange | Изменение дом-элемента, в который добавляются дочерние элементы группы.
Экземпляр класса Event.
Имена полей, доступных через метод Event.get:
Унаследовано от control.Group. |
click | Щелчок по заголовку списка. Экземпляр класса Event. |
collapse | Список закрыт. Экземпляр класса Event. |
expand | Список открыт. Экземпляр класса Event. |
mapchange | Сменилась карта.
Поля данных:
Унаследовано от IParentOnMap. |
optionschange | Изменение в опциях объекта. Унаследовано от ICustomizable. |
parentchange | Сменился родительский объект. Поля данных:
Унаследовано от IChild. |
remove | Произошло удаление дочернего объекта. Унаследовано от ICollection. |
Имя | Описание |
---|---|
add | Произошло добавление дочернего объекта. Унаследовано от ICollection. |
childcontainerchange | Изменение дом-элемента, в который добавляются дочерние элементы группы.
Экземпляр класса Event.
Имена полей, доступных через метод Event.get:
Унаследовано от control.Group. |
click | Щелчок по заголовку списка. Экземпляр класса Event. |
collapse | Список закрыт. Экземпляр класса Event. |
expand | Список открыт. Экземпляр класса Event. |
mapchange | Сменилась карта.
Поля данных:
Унаследовано от IParentOnMap. |
optionschange | Изменение в опциях объекта. Унаследовано от ICustomizable. |
parentchange | Сменился родительский объект. Поля данных:
Унаследовано от IChild. |
remove | Произошло удаление дочернего объекта. Унаследовано от ICollection. |
Методы
Имя | Возвращает | Описание |
---|---|---|
add(item[, positionIndex]) | Добавляет элемент управления в группу. Элемент можно добавлять, передав экземпляр класса, реализующего интерфейс IControl, или по ключу.
Возожные значения ключей:
Унаследован от control.Group. | |
collapse() | Сворачивает список. | |
each(callback[, context]) | Перебирает все элементы коллекции, вызывая для каждого функцию-обработчик. Унаследован от control.Group. | |
expand() | Раскрывает список. | |
filter(callback) | Функция для выборки дочерних элементов по условию. Унаследован от control.Group. | |
get() | Returns ссылку на объект контрола, добавленного по ключу или по индексу. Унаследован от control.Group. | |
getAll() | Returns массив дочерних элементов контрола. Унаследован от control.Group. | |
getChildElement(child) | HTMLElement | Возвращает для своего дочернего объекта HTML-элемент, в котором он должен размещаться. Унаследован от IControlParent. |
getContainer() | HTMLElement | Returns контейнер, в который добавляются дочерние элементы контрола. Унаследован от control.Group. |
getIterator() | Returns итератор по коллекции. Унаследован от ICollection. | |
getLength() | Number | Returns количество дочерних элементов. Унаследован от control.Group. |
getMap() | Returns ссылку на карту. Унаследован от IParentOnMap. | |
getParent() | Returns ссылку на родительский объект. Унаследован от IControl. | |
indexOf(childToFind) | Integer | Returns индекс дочернего элемента в группе. Унаследован от control.Group. |
isExpanded() | Boolean | Returns признак того, находится ли контрол в развернутом состоянии. |
remove(item) | Удаляет элемент управления из группы. Унаследован от control.Group. | |
removeAll() | Удаляет все дочерние элементы из группы. Унаследован от control.Group. | |
setMinWidth(width) | Устанавливает ширину списка. | |
setParent(parent) | Устанавливает родительский объект. Унаследован от IControl. | |
setTitle(html) | Задает новый заголовок раскрывающегося списка. |
Имя | Возвращает | Описание |
---|---|---|
add(item[, positionIndex]) | Добавляет элемент управления в группу. Элемент можно добавлять, передав экземпляр класса, реализующего интерфейс IControl, или по ключу.
Возожные значения ключей:
Унаследован от control.Group. | |
collapse() | Сворачивает список. | |
each(callback[, context]) | Перебирает все элементы коллекции, вызывая для каждого функцию-обработчик. Унаследован от control.Group. | |
expand() | Раскрывает список. | |
filter(callback) | Функция для выборки дочерних элементов по условию. Унаследован от control.Group. | |
get() | Returns ссылку на объект контрола, добавленного по ключу или по индексу. Унаследован от control.Group. | |
getAll() | Returns массив дочерних элементов контрола. Унаследован от control.Group. | |
getChildElement(child) | HTMLElement | Возвращает для своего дочернего объекта HTML-элемент, в котором он должен размещаться. Унаследован от IControlParent. |
getContainer() | HTMLElement | Returns контейнер, в который добавляются дочерние элементы контрола. Унаследован от control.Group. |
getIterator() | Returns итератор по коллекции. Унаследован от ICollection. | |
getLength() | Number | Returns количество дочерних элементов. Унаследован от control.Group. |
getMap() | Returns ссылку на карту. Унаследован от IParentOnMap. | |
getParent() | Returns ссылку на родительский объект. Унаследован от IControl. | |
indexOf(childToFind) | Integer | Returns индекс дочернего элемента в группе. Унаследован от control.Group. |
isExpanded() | Boolean | Returns признак того, находится ли контрол в развернутом состоянии. |
remove(item) | Удаляет элемент управления из группы. Унаследован от control.Group. | |
removeAll() | Удаляет все дочерние элементы из группы. Унаследован от control.Group. | |
setMinWidth(width) | Устанавливает ширину списка. | |
setParent(parent) | Устанавливает родительский объект. Унаследован от IControl. | |
setTitle(html) | Задает новый заголовок раскрывающегося списка. |
Описание полей
data
{data.Manager} data
- title - заголовок выпадающего списка.
Пример:
// Добавим на карту выпадающий список и будем менять его заголовок
// в зависимости от того, свернут список или развернут.
// Создадим группу слушателей событий.
var listBoxListener = listBox.events.group()
.add('expand', function () {
listBox.data.set('title', 'Список развернут');
})
.add('collapse', function () {
listBox.data.set('title', 'Список свернут');
});
map.controls.add(listBox, {top: 10, left: 10});
// ...
map.controls.remove(listBox);
// После удаления элемента с карты удалим слушателей.
listBoxListener.removeAll();
state
{data.Manager} state
- expanded - признак, раскрыт ли список.
Пример:
// Создадим и добавим на карту список, который изначально открыт.
var listBox = new ymaps.control.ListBox();
listBox.state.set('expanded', true);
map.controls.add(listBox);
Описание событий
Описание методов
collapse
{} collapse()
Сворачивает список.
expand
{} expand()
Раскрывает список.
isExpanded
{Boolean} isExpanded()
Returns признак того, находится ли контрол в развернутом состоянии.
setMinWidth
{} setMinWidth(width)
Устанавливает ширину списка.
Параметры:
* Обязательный параметр/опция.
setTitle
{} setTitle(html)
Задает новый заголовок раскрывающегося списка.
Параметры:
* Обязательный параметр/опция.