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

Варианты товара выпадающим списком и при этом меняется цена


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

 

JS скрипт:

// Выбор варианта
$('select[name=variant]').live('change', function(){
	price = $(this).find('option:selected').attr('data-price');
	compare_price = '';
	if(typeof $(this).find('option:selected').attr('data-compare-price') == 'string')
		compare_price = $(this).find('option:selected').attr('data-compare-price');
	$(this).closest('form.variants').find('.prc-new').html(price);
	$(this).closest('form.variants').find('.prc-old').html(compare_price);
	return false;
}); 

 

Сама разметка html:

<!-- Выбор варианта товара -->
<form class="variants" action="/cart">
	<div class="price">
		<div class="prc-old">
			{$product->variant->compare_price|convert} {$currency->sign|escape}
		</div>
		<div class="prc-new">
			{$product->variant->price|convert} {$currency->sign|escape}
		</div>
	</div>
	<div class="cart">
		{if $product->variants|count > 0}
			{if $product->variants|count>1}
			<select name="variant">
				{foreach $product->variants as $v}
				<option value="{$v->id}" data-price="{$v->price|convert} {$currency->sign|escape}" data-compare-price="{$v->compare_price|convert} {$currency->sign|escape}">{$v->name}</option>
				{/foreach}
			</select>
			{else}
			<input name="variant" value="{$product->variant->id}" type="radio" checked style="display:none!important;"/>
			{/if}
			<input class="button" type="submit" value="В корзину"/>
		{else}
			Нет в наличии
		{/if}
	</div>
</form>
<!-- end -->

А как переделать данный скрипт, чтобы работал с радио баттонами в стандартном варианте, не переделывая на селекты? Чтобы при выборе радио - менялась цена.

Ссылка на сообщение
Поделиться на другие сайты
  • Ответов 66
  • Дата создания
  • Последний ответ

Лучшие авторы в теме

Лучшие авторы в теме

Изображения в теме

Пытался JS скрипт переделать сам, но.. не вышло.

 

Писал примерно так

 

$('input[type=radio]').live('change', function(){
    price = $(this).find('input:checked').attr('data-price');
    compare_price = '';
    if(typeof $(this).find('input:checked').attr('data-compare-price') == 'string')
        compare_price = $(this).find('input:checked').attr('data-compare-price');
    $(this).closest('form.variants').find('.prc-new').html(price);
    $(this).closest('form.variants').find('.prc-old').html(compare_price);
    return false;
});
 
Ссылка на сообщение
Поделиться на другие сайты

Пытался JS скрипт переделать сам, но.. не вышло.

 

Писал примерно так

 

 

$('input[type=radio]').live('change', function(){    price = $(this).find('input:checked').attr('data-price');    compare_price = '';    if(typeof $(this).find('input:checked').attr('data-compare-price') == 'string')        compare_price = $(this).find('input:checked').attr('data-compare-price');    $(this).closest('form.variants').find('.prc-new').html(price);    $(this).closest('form.variants').find('.prc-old').html(compare_price);    return false;}); 
Вот так правильно:

$('input[type=radio]').live('check', function(){    price = $(this).find('input:checked').attr('data-price');    compare_price = '';    if(typeof $(this).find('input:checked').attr('data-compare-price') == 'string')        compare_price = $(this).find('input:checked').attr('data-compare-price');    $(this).closest('form.variants').find('.prc-new').html(price);    $(this).closest('form.variants').find('.prc-old').html(compare_price);    return false;}); 

События change нет в radio.

Нужно использовать click либо check.

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

 

Вот так правильно:

$('input[type=radio]').live('check', function(){    price = $(this).find('input:checked').attr('data-price');    compare_price = '';    if(typeof $(this).find('input:checked').attr('data-compare-price') == 'string')        compare_price = $(this).find('input:checked').attr('data-compare-price');    $(this).closest('form.variants').find('.prc-new').html(price);    $(this).closest('form.variants').find('.prc-old').html(compare_price);    return false;}); 

События change нет в radio.

Нужно использовать click либо check.

 

Спасибо! А как правильно html код переделать? Я уже как только не перемучался.. Вот участок кода (дефолт):

 

{if $product->variants|count > 0}
        <!-- Выбор варианта товара -->
        <form class="variants" action="/cart">
            <table>
            {foreach $product->variants as $v}
            <tr class="variant">
                <td>
                    <input id="product_{$v->id}" name="variant" value="{$v->id}" type="radio" class="variant_radiobutton" {if $product->variant->id==$v->id}checked{/if} {if $product->variants|count<2}style="display:none;"{/if}/>
                </td>
                <td>
                    {if $v->name}<label class="variant_name" for="product_{$v->id}">{$v->name}</label>{/if}
                </td>
                <td>
                    {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>
                </td>
            </tr>
            {/foreach}
            </table>
            <input type="submit" class="button" value="в корзину" data-result-text="добавлено"/>
        </form>
        <!-- Выбор варианта товара (The End) -->
        {else}
            Нет в наличии
        {/if}
 
Ссылка на сообщение
Поделиться на другие сайты

Ну как, для того, чтобы по выбору радио кнопки менялась основная цена. У вас в начале этой темы приведен код, для выпадащего списка:

 

<select name="variant">
                {foreach $product->variants as $v}
                <option value="{$v->id}" data-price="{$v->price|convert} {$currency->sign|escape}" data-compare-price="{$v->compare_price|convert} {$currency->sign|escape}">{$v->name}</option>
                {/foreach}
            </select>
 

А мне нужно для радио кнопок. Вот как я пытался сделать:

 

{if $product->variants|count>1}
            
                {foreach $product->variants as $v}

                <input id="product_{$v->id}" name="variant" data-price="{$v->price|convert} {$currency->sign|escape}" data-compare-price="{$v->compare_price|convert} {$currency->sign|escape}" value="{$v->id}" type="radio" 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}
                
                {/foreach}
            
  {else}
            <input name="variant" value="{$product->variant->id}" type="radio" checked style="display:none!important;"/>
            {/if}
 

В итоге по щелчку на радио кнопку ничего не меняется

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

С чего такие утверждения?

Сделать можно все.

 

потому что гладиолус, не ну через костыль сделать можно но это же не по феншую

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

Здравствуйте! Просьба помочь. Сделал варианты товаров выпадающим списком - всё работает, кроме символа валюты. При загрузке страницы товара место символа валюты "€" отображается 1. При изменении варианта товара символ "€" отображается, но при первой загрузке страницы такого не происходит. Скрины в приложении.

post-18745-0-79546600-1436949463_thumb.jpg

post-18745-0-14137000-1436949464_thumb.jpg

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

Здравствуйте! Просьба помочь. Сделал варианты товаров выпадающим списком - всё работает, кроме символа валюты. При загрузке страницы товара место символа валюты "€" отображается 1. При изменении варианта товара символ "€" отображается, но при первой загрузке страницы такого не происходит. Скрины в приложении.

 

код покажите а не скрин. что со скрина взять.

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

{if $product->variants|count>0}
<form class="variants" action="/cart">
<span class="prc-new">{$product->variant->price|convert} {$currency-sign|escape}</span>
<span class="prc-old">{if $product->variant->compare_price}
{$product->variant->compare_price|convert} {$currency->sign|escape}
{/if}
</span>
{if $product->variants|count>1}
<select name="variant">
{foreach $product->variants as $v}
<option value="{$v->id}" data-price="{$v->price|convert} {$currency->sign|escape}" data-compare-price="{if $product->variant->compare_price}{$v->compare_price|convert} {$currency->sign|escape}{/if}">{$v->name}</option>
{/foreach}
</select>
{else}
<input type="radio" name="variant" value="{$product->variant->id}" checked style="display:none!important"/>
{/if}
</form>
{else}
Нет в наличии
{/if}
Изменено пользователем Initauis
Ссылка на сообщение
Поделиться на другие сайты

 

{if $related_product->variants|count > 0}
		<!-- Выбор варианта товара -->
		<form class="variants" action="/cart">
			<table>
			{foreach $related_product->variants as $v}
			<tr class="variant">
				<td>
					<input id="related_{$v->id}" name="variant" value="{$v->id}" type="radio" class="variant_radiobutton"  {if $v@first}checked{/if} {if $related_product->variants|count<2} style="display:none;"{/if}/>
				</td>
				<td>
					{if $v->name}<label class="variant_name" for="related_{$v->id}">{$v->name}</label>{/if}
				</td>
				<td>
					{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>
				</td>
			</tr>
			{/foreach}
			</table>
			<input type="submit" class="button" value="Comprar" data-result-text="добавлено"/>
		</form>
		<!-- Выбор варианта товара (The End) -->
		{else}
			Нет в наличии
		{/if}

 

это же стандартный код связанных товаров. не вижу там никакого селекта

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

это же стандартный код связанных товаров. не вижу там никакого селекта

Я прошу прощения. Исправил пост выше. Другой код.

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

Я прошу прощения. Исправил пост выше. Другой код.

 

не правильно написано:

<span class="prc-new">{$product->variant->price|convert} {$currency-sign|escape}</span>

нужно

{$currency->sign|escape}
Ссылка на сообщение
Поделиться на другие сайты

 

не правильно написано:

<span class="prc-new">{$product->variant->price|convert} {$currency-sign|escape}</span>

нужно

{$currency->sign|escape}

Благодарен! Всё работает!

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

 

Благодарен! Всё работает!

Вот можите здесь посмотреть, со сменой изображений , для каждого варианта задается отдельное изображение. http://forum.simplacms.ru/topic/9435-изображение-для-варинтов/#entry75372

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

Ну как, для того, чтобы по выбору радио кнопки менялась основная цена. У вас в начале этой темы приведен код, для выпадащего списка:

 

<select name="variant">
                {foreach $product->variants as $v}
                <option value="{$v->id}" data-price="{$v->price|convert} {$currency->sign|escape}" data-compare-price="{$v->compare_price|convert} {$currency->sign|escape}">{$v->name}</option>
                {/foreach}
            </select>
 

А мне нужно для радио кнопок. Вот как я пытался сделать:

 

{if $product->variants|count>1}
            
                {foreach $product->variants as $v}

                <input id="product_{$v->id}" name="variant" data-price="{$v->price|convert} {$currency->sign|escape}" data-compare-price="{$v->compare_price|convert} {$currency->sign|escape}" value="{$v->id}" type="radio" 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}
                
                {/foreach}
            
  {else}
            <input name="variant" value="{$product->variant->id}" type="radio" checked style="display:none!important;"/>
            {/if}
 

В итоге по щелчку на радио кнопку ничего не меняется

У меня тоже так и не заработало с радиокнопками, ни ошибок ни результата нет..

Может у когото получилось с радиокнопками - поделитесь секретом, как?

Ссылка на сообщение
Поделиться на другие сайты
  • 3 месяца спустя...
<form class="variants" action="/cart">
<span>{$product->variant->price|convert}</span>
{$currency->sign|escape}
{if $v->compare_price > 0}        
{else}
Vip-клуб:
{floor({$product->variant->price}*0.95)}
{/if}
<select name="variant" {if $product->variants|count==1  && !$product->variant->name}style='display:none;'{/if}>
{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>  
<input type="submit" class="button" value="Купить" data-result-text="В корзине"/>
</form>

Подскажите пожалуйста.

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

Заранее спасибо

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

Подскажите пожалуйста.

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

Заранее спасибо

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

		{if $product->variants|count>0}
<form class="variants" action="/cart">
	<span class="prc-new">{$product->variant->price|convert} {$currency->sign|escape}</span>
	
 
	{if $product->variants|count>1}
	<select name="variant">
		{foreach $product->variants as $v}
		<option value="{$v->id}" data-price="{$v->price|convert} {$currency->sign|escape}" data-compare-price="{$v->compare_price|convert} {$currency->sign|escape}">{$v->name}</option>
		{/foreach}
	</select>
	{else}
	<input type="radio" name="variant" value="{$product->variant->id}" checked style="display:none!important"/>

 


{/if}
 {foreach $product->variants as $v}
 Vip-клуб:
<span class="prc-new">{floor({$product->variant->price}*0.95)} {$currency->sign|escape}</span>
{/foreach}
         </form>
{else}
Нет в наличии
{/if}

Первый вариант нормально отнимает 5% а второй вариант выводит цену без скидки. (Все сделал по статье NOXTER)

 

 

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

Попробуйте сделать все с нуля по моей статье.

 

Noxter подскажи в чем может быть проблема все работает норм (делал по твоей статье) но в чем бок пропала кнопка "Добавить в корзину" что делать?

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

 

Noxter подскажи в чем может быть проблема все работает норм (делал по твоей статье) но в чем бок пропала кнопка "Добавить в корзину" что делать?

Завтра обновлю статью, забыл кнопку прописать.

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

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

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

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

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

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

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

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

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

Загрузка...

×
×
  • Создать...