Перейти к содержанию
Официальный форум поддержки Simpla

Хелп! Выбор варианта товара + js (Выбор варианта товара) [решено]


Рекомендуемые сообщения

Добрый день, уважаемые пользователи. Сейчас варианты товара выбираются при помощи инпута с типом радио, и выделенному дается класс чекед. Как сделать, что бы добавлялся класс к элементу в котором находится выделенный инпут. Это нужно, что бы при помощи ксс добавить пару свойств выделенному варианту товара.
Решение:
http://jsfiddle.net/g9E49/29/

Ссылка на сообщение
Поделиться на другие сайты

<div id="box_grid" class="cart-box">
{if $product->variants|count > 0}
	<!-- Выбор варианта товара -->
	<form class="variants" action="/cart">
		<ul>
		{foreach $product->variants as $v}
                        <li class="variant"><span class="activ-variant"></span><p><input id="product_{$v->id}" name="variant" value="{$v->id}" type="checkbox" class="variant_radiobutton" {if $product->variant->id==$v->id}checked{/if} {if $product->variants|count<2}style="display:none;"{/if}/>
{if $v->name}<label class="variant_name" for="product_{$v->id}">{$v->name}</label>{/if}
{if $v->compare_price > 0}<span class="compare_price">{$v->compare_price|convert}</span>{/if}
<span class="price">{$v->price|convert} <span class="currency">{$currency->sign|escape}</span></span>
</p></li>
		{/foreach}
		</ul>
		<input type="submit" class="button" value="в корзину" data-result-text="добавлено"/>
	</form>
	<!-- Выбор варианта товара (The End) -->
	{else}
		Нет в наличии
	{/if}
 </div>


и js

$("#box_grid ul li").click(function(e) {    $("#box_grid ul li").removeClass("selected");    var $checkbox = $(this).find(':checkbox');    $("#emp_grid :checkbox").not($checkbox).removeAttr("checked");    if (e.target.type == "checkbox") {        // stop the bubbling to prevent firing the row's click event        e.stopPropagation();        $(this).filter(':has(:checkbox)').toggleClass('selected', $checkbox.attr('checked'));    } else {                $checkbox.attr('checked', !$checkbox.attr('checked'));        $(this).filter(':has(:checkbox)').toggleClass('selected', $checkbox.attr('checked'));    }});
Ссылка на сообщение
Поделиться на другие сайты

Вах вах, сейчас попробую, большое спасибо вам!
работает почти хорошо) не понятная проблема. Пока не нажмешь на другой вариант, не добавляются классы.
Вот обновил ваш код со своим вариантом: http://jsfiddle.net/g9E49/35/
Все все, разобрался. тупанул) Большое вам спасибо!

Ссылка на сообщение
Поделиться на другие сайты
  • 1 год спустя...

как задать стиль для выпадающего выбора (select)? ранее было передално с радио.

 

вот есть решение с помощью jquery - https://github.com/adamcoulombe/jquery.customSelect
получается неплохо- http://jsfiddle.net/adamco/7ttWj/

 

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

 

кусок кода выбора варианта:
 

			<!-- Выбор варианта товара -->
			{* Не показывать выбор варианта, если он один и без названия *}
                        Модель: 
			<select name="variant" class="styled">
			
                                {foreach $product->variants as $v}
                              
				<option value="{$v->id}" {if $v->compare_price > 0}compare_price="{$v->compare_price|convert}"{/if} {if $v->image}big="{$v->image|resize:800:600}" small="{$v->image|resize:450:450}"{/if}  price="{$v->price|convert}">
                                {$v->name}
				</option>
                  
				{/foreach}
                                 
			</select>
			<!-- Выбор варианта товара (The End) -->
Ссылка на сообщение
Поделиться на другие сайты

Присоединяйтесь к обсуждению

Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.

Гость
Ответить в этой теме...

×   Вставлено с форматированием.   Вставить как обычный текст

  Разрешено использовать не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отображать как обычную ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставлять изображения напрямую. Загружайте или вставляйте изображения по ссылке.

Загрузка...
×
×
  • Создать...