Клуб API Карт

Двухуровневое меню для карты и Bootstrap

shopgo51
11 июня 2016, 10:42

В Песочнице есть пример "Вывод списка объектов карты". Скачал, запустил локально. Всё работает. Подставил свои данные. Опять всё работает. Но захотелось в Bootstrap'е повторить. Делаю так:

<body>
<div class="container">
  <div class="row">
<div class="dropdown" style="position:relative">
	<a href="#" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">Группы объектов<span class="caret"></span></a>

</div>

  </div>
</div>
<div id="map"></div>
</body>

Далее вместо используемого в примере menu.appendTo($('body')); делаю menu.appendTo($('.dropdown'));

Карта с объектами отрисовывается. Навигация по меню работает. Но по кликам на втором уровне не показываются балуны, как в примере, а при клике на первом уровне одновременно с показом/скрытием второго уровня не показываются/скрываются метки объектов.

Для реализации навигации по меню используются два обработчика:

	$(".dropdown-menu > li > a.trigger").on("click",function(e){
		var current=$(this).next();
		var grandparent=$(this).parent().parent();
		if($(this).hasClass('left-caret')||$(this).hasClass('right-caret'))
			$(this).toggleClass('right-caret left-caret');
		grandparent.find('.left-caret').not(this).toggleClass('right-caret left-caret');
		grandparent.find(".sub-menu:visible").not(current).hide();
		current.toggle();  // показ/скрытие submenu
//		alert('1 !');
		e.stopPropagation();
	});
	$(".dropdown-menu > li > a:not(.trigger)").on("click",function(e){
		var root=$(this).closest('.dropdown');
		root.find('.left-caret').toggleClass('right-caret left-caret');
//		alert('2 !');
        
        event.preventDefault();
		event.stopPropagation();
	});

Как мне кажется, где-то разорвалась цепочка обработчиков событий для элементов меню и геообъектов, про которую говорится в аннотации к примеру. Используемые для навигации по меню добавленные обработчики не влияют на ситуацию. Без них меню высвечивается сразу развернутым, но клик по любому из пунктов просто закрывает все уровни без изменений на карте.

В какую сторону смотреть ? Где и что нужно подправить ?

1 комментарий
Подписаться на комментарии к посту
Кажется вы слишком все усложнили в ваших обработчиках. Геообъекты со списком по которому они построены можно связать либо в замыкании, либо по индексам в списках.
Если метки у вас не скрываются и балуны не появляются, проверьте есть ли у вас ссылки на эти геообъекты в обработчиках.


Так же в примере в песочнице используется старая версия jQuery, и в новых уже нет .toggle(fn1, fn2)


PS: Лучше собирать минимальный пример на jsfiddle, по коду в посте особо не поможешь.