Перейти к содержимому


Фото
- - - - -

вариант товара с картинкой


  • Чтобы отвечать, сперва войдите на форум
5 ответов в теме

#1 Kami

Kami
  • Пользователь
  • 142 сообщений
  • Откуда:Россия

Опубликовано 25.04.2018 - 15:36

Друзья, возник вопрос.

 

 

Задача состояла в следующем. Нужно было сделать возможность привязать из определенной папки картинки в каждому варианту.

 

Была создана вкладка изображения варианта

 

в ней поля id name image ( например белый дуб) цвет мебели и само изображение.

В базе все хранится в отдельной таблице s_pictures

 

 

в таблице s_variants храню pictures_id  , ид выбраного изображения для каждого варианта. 

 

Проблема в выводе.

 

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

 

               <select>
                  {foreach $product->variants as $v}
                  <option value="{$v->id}" {if $v->compare_price > 0}compare_price="{$v->compare_price|convert}"{/if} price="{$v->price|convert}">
                     {$v->name}
                  </option>
                  {/foreach}
               </select>

выпадающий список вариантов

 

					{foreach $product->pictures as $picture}
						{if $picture->image}
<img src="{$config->pictures_images_dir}{$picture->image}" width="100" height="100" alt="" />

						{/if}
                
					{/foreach}

вывод изображений всех вариантов. 

 

на выходе получаю ( если 4 варианта с изображениями)

4 изображения и под ними выпадающий список.

А нужно 1 изображение и чтоб при изменении варианта менялась картинка варианта.

Надеюсь понятно описал.

 

YG2gt.png

 

MCpwF.png


Изменено: Kami, 25.04.2018 - 15:43


#2 phukortsin

phukortsin
  • Пользователь
  • 211 сообщений
  • Программирование, Пользователь
  • Версия CMS:2.x
  • Откуда:Львов

Опубликовано 25.04.2018 - 17:04

Это типовая задача для JS или Jquery.  Много решений для подобных задач можно найти на форуме, например в теме

http://forum.simplac...е-для-варинтов/

можно найти много полезного по Вашей задаче...



#3 Kami

Kami
  • Пользователь
  • 142 сообщений
  • Откуда:Россия

Опубликовано 25.04.2018 - 17:46

Это типовая задача для JS или Jquery.  Много решений для подобных задач можно найти на форуме, например в теме

http://forum.simplac...е-для-варинтов/

можно найти много полезного по Вашей задаче...

:)эта задача никак не похожа на мою. Там изображение товара прикрепляется, а тут я свои изображения каждому варианту прикрепляю



#4 phukortsin

phukortsin
  • Пользователь
  • 211 сообщений
  • Программирование, Пользователь
  • Версия CMS:2.x
  • Откуда:Львов

Опубликовано 25.04.2018 - 18:06

А нужно 1 изображение и чтоб при изменении варианта менялась картинка варианта.

 

Эта задача - очень похожа на малую часть того, что делается в теме по данной ранее ссылке. Из той темы и решение для Вашей задачи можно извлечь...



#5 Kami

Kami
  • Пользователь
  • 142 сообщений
  • Откуда:Россия

Опубликовано 26.04.2018 - 01:14

Нашел вот такое решение

<select id="selm" name="m">
	<option data-path="/images/znaki_oven.png" value="ov">Овен</option>
	<option data-path="/images/znaki_telec.png" value="te">Телец</option>
	<option data-path="/images/znaki_blizneci.png" value="bl">Близнецы</option>
</select>

<div id="selmimg"><img src="/images/znaki_oven.png" /></div>


$(document).ready(function(){
	$('#selm').change(function(){
		$('#selmimg').find('img:first').attr('src', $('#selm option:selected').attr('data-path'));
	});
});

Но как мне в цикле {foreach $product->variants as $v} получить урл привязанного изображения из {foreach $product->pictures as $picture}

 

Пока я вывожу отдельно варианты и отдельно цикл всех привязанных картинок я так понял.



#6 phukortsin

phukortsin
  • Пользователь
  • 211 сообщений
  • Программирование, Пользователь
  • Версия CMS:2.x
  • Откуда:Львов

Опубликовано 26.04.2018 - 08:34

Но как мне в цикле {foreach $product->variants as $v} получить урл привязанного изображения из {foreach $product->pictures as $picture}

Как обычно. В зависимости от конкретной структуры $product->pictures...






0 пользователей читают эту тему

0 пользователей, 0 гостей, 0 скрытых