Как заменить radio выбор артикула в товаре на выпадающий список?
Когда много артикулов в материнском товаре было бы компактнее выбирать из выпадающего селектора. И при выборе, чтобы цена менялась и фото артикула.
Как код переписать?
Собственно исходный код radio списка (из product.cart.html ):
{* SKU selector *}
<ul class="skus">
{foreach $product.skus as $sku}
{$sku_available = $product.status && $sku.available && ($wa->shop->settings('ignore_stock_count') || $sku.count === null || $sku.count > 0)}
<li itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<label{if !$sku.available} class="disabled"{/if}>
<input name="sku_id" type="radio" value="{$sku.id}"{if !$sku.available} disabled="true"{/if}{if !$sku_available}data-disabled="1"{/if}{if $sku.id == $product.sku_id} checked="checked"{/if} data-compare-price="{shop_currency($sku.compare_price, $product.currency, null, 0)}" data-price="{shop_currency($sku.price, $product.currency, null, 0)}"{if $sku.image_id} data-image-id="{$sku.image_id}"{/if}> <span itemprop="name">{$sku.name|escape}</span>
{if $sku.sku}<span class="hint" itemprop="name">{$sku.sku|escape}</span>{/if}
<meta itemprop="price" content="{shop_currency($sku.price, $product.currency)}">
<meta itemprop="priceCurrency" content="RUB" />
<span class="price tiny nowrap">{shop_currency_html($sku.price, $product.currency)}</span>
{if (!($sku.count === null) && $sku.count <= 0)}
<link itemprop="availability" href="http://schema.org/OutOfStock" />
{else}
<link itemprop="availability" href="http://schema.org/InStock" />
{/if}
</label>
</li>
{$product_available = $product_available or $sku_available}
{/foreach}
</ul>
3 ответа
Ответ: обратиться за платной помощью к экспертам. Не тот объем работы, чтобы делать это бесплатно. Да и при этом многие плагины, подвязанные к выборам артикулов, перестанут работать корректно. Чтобы этого избежать нужно весь день убить на реализацию связки "отображаемый селект" + "рабочие, но скрытые отрицательным отступом радио".
Да, только хотел сказать:
1. скрываем радио буттоны с помощью css
2. выводим селект с нужным перечнем
3. пишем JS скрипт, который при смене селекта изменяет выбор радио буттона.
Это самая простая реализация. Можно бутоны вообще убрать и выводит селект, но придется переписать все скрипты, связнные с этим. Так же могут быть проблемы с плагинами, которые используют эти буттоны
Спасибо! Так и попробую сделать. Селектор-то осилила сформировать, а дальше затык был.