Клуб API Карт

Клуб API Карт

Как стилизовать поле поиска в yandex maps api?

Пост в архиве.

На карте есть компонент ymaps.control.SearchControl. Нужно немного поменять его внешний вид - шрифт, цвет задника, отступы. При этом хотелось бы не потерять существующий функционал (подсказка при вводе, поиск по нажатию на Enter).

Подозреваю, что нужно менять свойство formLayout, но какие в нем доступны аргументы и как переиспользовать выпадающий список подсказок - не понятно.

Есть ли где-либо пример, как это делается?

3 комментария
Авторизуйтесь, чтобы оставить комментарий
mail@spark.ms
23 марта 2016, 10:17
Придумал, как сделать. Возможно, кому-то пригодится.

1. Верстаем форму так, как она должна выглядеть.
2. Создаем шаблон с помощью ymaps.templateLayoutFactory.createClass.
3. В методе build подписываемся на событие submit у формы, в обработчике делаем следующее:
<code lang="javascript">
searchCallback: function(e) {
e.preventDefault();

var ctrl = this.getData().control;
ctrl.search($('#search-field').val());
}
</code>
4. Там же создаем ymaps.SuggestView, передаем ему id поля поиска (без решетки).
teufel5002
22 апреля 2016, 17:32
mail@spark.ms,
добрый человек, а не найдется ли у тебя примера на jsfiddle?
ewgeniykart
20 июня 2017, 16:01
mail@spark.ms,
тот же вопрос.
шаблон создать получилось, в билде на сабмит формы привязался, а кому ставить обработчик  searchCallback, у control.SearchControl вроде стандартного нет такого...