Jump to content

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


Recommended Posts

  • Replies 66
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

Обновил статью.

Вот если бы еще и меняло скидку на варианты 

{if $product->variant->compare_price > 0}
             Скидка: {floor(abs(100-{$product->variant->price}/($product->variant->compare_price)*100))}%
               {/if}
Link to post
Share on other sites

Вот если бы еще и меняло скидку на варианты 

{if $product->variant->compare_price > 0}

             Скидка: {floor(abs(100-{$product->variant->price}/($product->variant->compare_price)*100))}%

               {/if}

При смене варианта меняется старая и обычная цена, % скидки не меняется, это не всем магазинам нужно.

Вы можете расширить скрипт дописав в <option> нужные параметры, а также дописав html + JS, смотрите как сделано для data-price и делайте по аналогии.

Link to post
Share on other sites

При смене варианта меняется старая и обычная цена, % скидки не меняется

 

Очевидно, что еще как меняется, так как % скидки высчитывается по приведенной формуле...

 

А еще автору статьи хорошо бы проявить заботу о читателях, и обновить устаревшую конструкцию

$('select[name=variant]').live('change', function(){

потому как у пользователей современных версий JQuery это просто не работает.

Link to post
Share on other sites

Вот если бы еще и меняло скидку на варианты 

{if $product->variant->compare_price > 0}

             Скидка: {floor(abs(100-{$product->variant->price}/($product->variant->compare_price)*100))}%

               {/if}

 

Пробуйте так:

{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">{$product->variant->compare_price|convert} {$currency->sign|escape}</span>
    <span class="prc-discount">{if $product->variant->compare_price > 0} Скидка: {floor(abs(100-{$product->variant->price}/($product->variant->compare_price)*100))}%{/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="{$v->compare_price|convert} {$currency->sign|escape}" data-discount="{if $v->compare_price > 0} Скидка: {floor(abs(100-{$v->price}/($v->compare_price)*100))}%{/if}">{$v->name}</option>
        {/foreach}
    </select>
    {else}
    <input type="radio" name="variant" value="{$product->variant->id}" checked style="display:none!important"/>
    {/if}
    <input type="submit" value="в корзину" class="button" data-result-text="добавлено"/>
</form>
{else}
Нет в наличии
{/if}


{literal}
<script>
// Выбор варианта
$('select[name=variant]').on('change', function(){
    price = $(this).find('option:selected').attr('data-price');
    compare_price = $(this).find('option:selected').attr('data-compare-price');
    discount = $(this).find('option:selected').attr('data-discount');
    $(this).closest('form.variants').find('.prc-new').html(price);
    $(this).closest('form.variants').find('.prc-old').html(compare_price);
    $(this).closest('form.variants').find('.prc-discount').html(discount);
});
</script>
{/literal}

Link to post
Share on other sites

Очевидно, что еще как меняется, так как % скидки высчитывается по приведенной формуле...

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

Неужели это по коду не видно или очередной доеб без повода?

А еще автору статьи хорошо бы проявить заботу о читателях, и обновить устаревшую конструкцию

$('select[name=variant]').live('change', function(){

потому как у пользователей современных версий JQuery это просто не работает.

Во первых рассчитано на тех кто использует стандартный шаблон в котором jQuery версии 1.7, во вторых jQuery постоянно обновляется и я не собираюсь бегать за этими обновлениями и постоянно переписывать статью.

Что по твоему должно быть в статье для пользователей jQuery версии 1.7 если я статью обновлю до последней версии jQuery? Писать новую статью?

Корс не занимайся хуйней.

Link to post
Share on other sites
  • 4 months later...

А как сделать так, что при выборе варианта товара, менялся и артикул?

Сейчас, к примеру у товару у которого три варианта и для каждого есть свой артикул выводятся списком три артикла. 

 

 

В шаблоне артикул вывожу вот так:

 {foreach from=$product->variants item=variant}
     <div class="article">Артикул: - {$variant->sku}	</div>
                        {/foreach}
Edited by motya88
Link to post
Share on other sites
  • 2 months later...
  • 2 years later...

 

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 -->

 

А если получить цену товара нужно без руб. Регулярным выражением это делать?

Просто изначально цена просто цифрой 200.00 , при изменении варианта уже цена приходит в формате 200.00 руб

Edited by Kami
Link to post
Share on other sites

Вот это вот надо убрать, и будет чена без рублей

http://prntscr.com/mb0edx

 

супер, скажите добавил input количество, прописал все что нужно в ajax_cart.js . Все работает, но нужна такая фича, 

 

Есть цена за товар и общая цена покупки, цена за товар меняется при выборе вариантов, что реализовано выше, а при изменении количества должна меняться итоговая сумма без перезагрузки страницы

я так понимаю просто на js создать переменную total_price , а возле инпута сделать 2 span к примеру + и -

и при клике на него цену умножать на количество. подскажите как в техническом плане реализовать в той же функции что и выше.

Link to post
Share on other sites
  • 7 months later...

Здравствуйте , подскажите, если у варианта кол-во 0 , то как сделать ,чтоб его не показывало в списке на карточке товара.?

<form class="variants single_cart_form" data-id="{$product->id}" data-name="{$product->name}">
					<div class="product_options buttons_added clearfix">
						<label class="orderby_label product_option_con f_left {if $product->variants|count == 1} hidden{/if}">
							<select name="variant" id="{$prefix}variant_{$product->id}" class="orderby" data-productid="{$product->id}">
								{foreach $product->variants as $v}
									<option value="{$v->id}" 
										data-price="{$v->price|convert} {$currency->sign|escape}" 
										{if $v->compare_price} data-compare="{$v->compare_price|convert} {$currency->sign|escape}"{/if}
										{if $v->name} data-name="{$v->name}"{/if}
										{if $product->variant->id==$v->id}selected{/if}
									>{$v->name}</option>
								{/foreach}
							</select>
						</label>
						<div class="quantity_controll_con f_left">
							<input type="button" value="-" class="quantity_controll minus">
							<input type="number" step="1" min="1" name="amount" value="1" title="Количество" class="input-text" size="4">
							<input type="button" value="+" class="quantity_controll plus">
						</div>
					<button type="submit" class="send_button f_left"><i class="ico-cart"></i>В корзину</button>
					</div>
				</form>
Link to post
Share on other sites

 

Здравствуйте , подскажите, если у варианта кол-во 0 , то как сделать ,чтоб его не показывало в списке на карточке товара.?

<form class="variants single_cart_form" data-id="{$product->id}" data-name="{$product->name}">
					<div class="product_options buttons_added clearfix">
						<label class="orderby_label product_option_con f_left {if $product->variants|count == 1} hidden{/if}">
							<select name="variant" id="{$prefix}variant_{$product->id}" class="orderby" data-productid="{$product->id}">
								{foreach $product->variants as $v}
									<option value="{$v->id}" 
										data-price="{$v->price|convert} {$currency->sign|escape}" 
										{if $v->compare_price} data-compare="{$v->compare_price|convert} {$currency->sign|escape}"{/if}
										{if $v->name} data-name="{$v->name}"{/if}
										{if $product->variant->id==$v->id}selected{/if}
									>{$v->name}</option>
								{/foreach}
							</select>
						</label>
						<div class="quantity_controll_con f_left">
							<input type="button" value="-" class="quantity_controll minus">
							<input type="number" step="1" min="1" name="amount" value="1" title="Количество" class="input-text" size="4">
							<input type="button" value="+" class="quantity_controll plus">
						</div>
					<button type="submit" class="send_button f_left"><i class="ico-cart"></i>В корзину</button>
					</div>
				</form>

 

{if $v->price != 0} ....{/if}

Link to post
Share on other sites

а куда вставить в код, чтоб выполняло правило? 

только не ругайтесь)))

{if $v->price != 0} ....{/if} - это разве не цена?

 

Это обертка означает условие -- Если цена не равна 0 то выводить код который указан взамен многоточий..   Тут ума не надо в какое место вставить мой пример

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...