Форум

1. Есть товар с несколькими торговыми предложениями - работает.
   
2. Зависит от цвета и иногда от ещё двух параметров торгового предложения - работает.
   
3. Есть переключение товара с изменением цены по клику по картинке - работает.
   
4. Штатный слайдер для галереи -  не работает, и в таком формате не нужен был (у нас для каждого товара жёсткий набор: фото, схема и упаковка, схему с упаковкой через отдельные поля гружу).
   

1. Как добавить дополнительное переключение по выпадающему списку, чтобы они были связаны - при клике по мини картинке (доступные цвета) менялась картинка товара и название цвета в выпадающем меню (доступные цвета) и по клику в выпадающем меню менялись картинка товара и мини картинка цвета?
   
2. Как получить ссылку на актуальную картинку товара после переключения без костылей, должен же быть кошерный способ (мне для альтернативного слайдера надо - картинки из дополнительных полей нормально грузятся, а фото товара - только первое по умолчанию)?
   

<select class="form-control" id="sel_drop">
<?
   foreach ($skuProperty['VALUES'] as &$value)
   {
      $value['NAME'] = htmlspecialcharsbx($value['NAME']);
      if ($value['NAME'] and strlen($value['NAME']) > 1) // Выводило
      {
         echo "<option data-treevalue='" . $propertyId . "_" . $value['ID'] . "' data-oneva lue='" . $value['ID'] . "'>" . $value['NAME'] . "</option>";
      }
   }

?>

</select>

Выпадающий снабжаю атрибутами и цепляю функцию, которая кликает на мини картинки и подменяю фото для альтернативного слайдера. Тут разобрался, хотя костылём попахивает, хотелось бы на другом уровне (правильном) это решить. Есть идеи?
А как всё-таки скорректировать обработчик клика по картинке для корректировки выпадающего списка? Добавить с другим именем дублирующую, но как-то не правильным кажется такой вариант. Может более грамотный способ есть?

Сделал подмену картинок из выпадающего:

$( "#sel_drop" ).change(function() {var current_img_code = this.querySelector(':checked').getAttribute('data-onevalue'); // Штатное событие для изменения ТП
$('.product_colors [data-oneva lue="' + current_img_code + '"]').trigger('click');
var current_img_src = $(".product-item-detail-slider-container .product-item-detail-slider-images-container .product-item-detail-slider-image img").prop("currentSrc");
$('#lightbox .carousel-inner .item:first-child img').attr("src", current_img_src);});

$('.product-item-detail-info-container.product_colors li > div').click(function() {
   var current_img_code = $(this).parent().get(0).getAttribute('data-onevalue'); // Штатное событие для изменения ТП
   $("#sel_drop").val(current_img_code);
})