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

не работает изменение цены при выборе варианта


Перейти к решению Решено mishanya,

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

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

{literal}
<script>
$(function() {
	// Выбор вариантов
	$('select[name=variant]').change(function() {
		price = $(this).find('option:selected').attr('price');
		compare_price = $(this).find('option:selected').attr('compare_price');
		$(this).closest('span.regular-price').find('span[name=price]').html(price);
		$(this).closest('span.regular-price').find('strike[name=price]').html(compare_price);
		return false;
	});

});
</script>
{/literal}

{if $product->variants|count<2}{else}
    <dl>
<dt><label class="required"><em>*</em>Выберите упаковку:</label></dt>
<dd>
    <div class="input-box">
				<select class="select{$product->id} required-entry product-custom-option form-control" name="variant">
					{foreach $product->variants as $v}
						<option id="featured_{$v->id}"  value="{$v->id}" {if $v->compare_price > 0} compare_price="{$v->compare_price|convert}"{/if} price="{$v->price|convert}"  >{if $v->name}{$v->name}{/if}</option>
					{/foreach}
				</select>
	</div>
</dd>
	</dl>

		<p class="required">* Обязательные поля</p>
{/if}
    </div>

<div class="product-options-bottom">

<!-- Цена -->
<div class="price-box"><span class="regular-price">                                         
<span class="price">
{if $product->variant->compare_price > 0} 
<strike name="price">Цена: {$product->variant->compare_price|convert}</strike> {$currency->sign|escape}
<span name="price">Цена: {$product->variant->price|convert}</span> {$currency->sign|escape}
</span>
{else}
<span class="price">Цена: {$product->variant->price|convert} {$currency->sign|escape}</span>
{/if}
</span></div>

<div class="price-box">
{if $user->discount} 
* Скидка {$user->discount|convert}% будет учтена при оформлении заказа.
{/if}
</div>
<!-- Цена (End)-->


	<div class="add-to-cart">
		<div class="qty-block">
			<label for="qty">Количество:</label>
			<input class="input-text qty form-control" type="text" title="Кол-во" size="2" name="amount" value="1">
		</div>
			<input class="button btn-cart" title="Добавить в корзину" type="submit" data-result-text="Добавлено" onclick="yaCounter25367054.reachGoal('productADD2CART'); return true;" value="Добавить в корзину" >

	</div>

</div>
			</form>
		{else}
			<div class="price-box"><span class="regular-price"><span class="price">Скоро будет</span></span></div>
		{/if}
Изменено пользователем gmyz
Ссылка на сообщение
Поделиться на другие сайты

$(this).closest('span.regular-price') - тут ошибка. Не видно такого такого элемента в Вашем коде...

{literal}
<script>
$(function() {
	// Выбор вариантов
	$('select[name=variant]').change(function() {
		price = $(this).find('option:selected').attr('price');
		compare_price = $(this).find('option:selected').attr('compare_price');
		$(this).closest('form.variants').find('span[name=price]').html(price);
		$(this).closest('form.variants').find('strike[name=price]').html(compare_price);
		return false;
	});

});
</script>
{/literal}

Поменял. Все равно не работает. Какие еще могут быть варианты?

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

Вариантов еще десятки, а может, и тысячи и миллионы...

 

$(this).closest('form.variants')  - этого в Вашем коде тоже не видно...

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

Вариантов еще десятки, а может, и тысячи и миллионы...

 

$(this).closest('form.variants')  - этого в Вашем коде тоже не видно...

Извиняюсь. Мой косяк. Не весь код скопировал. Вот полный отрезок кода

{literal}
<script>
$(function() {
	// Выбор вариантов
	$('select[name=variant]').change(function() {
		price = $(this).find('option:selected').attr('price');
		compare_price = $(this).find('option:selected').attr('compare_price');
		$(this).closest('form.variants').find('span[name=price]').html(price);
		$(this).closest('form.variants').find('strike[name=price]').html(compare_price);
		return false;
	});

});
</script>
{/literal}
	
			<form class="variants" action="/cart">
	<div id="product-options-wrapper" class="product-options">

{foreach $product->variants as $v}
<input id="product_{$v->id}" name="variant" value="{$v->id}" type="radio" {if $product->variant->id==$v->id}checked{/if} style="display:none;"/>
{/foreach}

{if $product->variants|count<2}{else}
    <dl>
<dt><label class="required"><em>*</em>Выберите упаковку:</label></dt>
<dd>
    <div class="input-box">
				<select class="select{$product->id} required-entry product-custom-option form-control" name="variant">
					{foreach $product->variants as $v}
						<option id="featured_{$v->id}"  value="{$v->id}" {if $v->compare_price > 0} compare_price="{$v->compare_price|convert}"{/if} price="{$v->price|convert}"  >{if $v->name}{$v->name}{/if}</option>
					{/foreach}
				</select>
	</div>
</dd>
	</dl>

		<p class="required">* Обязательные поля</p>
{/if}
    </div>

<div class="product-options-bottom">

<!-- Цена -->
<div class="price-box"><span class="regular-price">                                         
<span class="price">
{if $product->variant->compare_price > 0} 
<strike name="price">Цена: {$product->variant->compare_price|convert}</strike> {$currency->sign|escape}
<span name="price">Цена: {$product->variant->price|convert}</span> {$currency->sign|escape}
</span>
{else}
<span class="price">Цена: {$product->variant->price|convert} {$currency->sign|escape}</span>
{/if}
</span></div>

<div class="price-box">
{if $user->discount} 
* Скидка {$user->discount|convert}% будет учтена при оформлении заказа.
{/if}
</div>
<!-- Цена (End)-->


	<div class="add-to-cart">
		<div class="qty-block">
			<label for="qty">Количество:</label>
			<input class="input-text qty form-control" type="text" title="Кол-во" size="2" name="amount" value="1">
		</div>
			<input class="button btn-cart" title="Добавить в корзину" type="submit" data-result-text="Добавлено" onclick="yaCounter25367054.reachGoal('productADD2CART'); return true;" value="Добавить в корзину" >

	</div>

</div>
			</form>
		{else}
			<div class="price-box"><span class="regular-price"><span class="price">Скоро будет</span></span></div>
		{/if}
Ссылка на сообщение
Поделиться на другие сайты

код у вас еще cтраннее. зачем этот кусок если внизу есть селект

{foreach $product->variants as $v}
	<input id="product_{$v->id}" name="variant" value="{$v->id}" type="radio" {if $product->variant->id==$v->id}checked{/if} style="display:none;"/>
{/foreach}

 

 

еще у вас в условии если у первого варианта нет старой цены то она никогда не покажется потому что элемент <strike></strike> не выведется в шаблон

Изменено пользователем mishanya
Ссылка на сообщение
Поделиться на другие сайты
  • Решение

вот кусок работающего кода

 

{if $product->variants|count > 0}
	{literal}
	<script>
	$(function() {
		// Выбор вариантов
		$('select[name=variant]').change(function() {
			price = $(this).find('option:selected').attr('price');
			compare_price = $(this).find('option:selected').attr('compare_price');
			$(this).closest('form.variants').find('span.price span').html(price);
			if(compare_price) {
				$(this).closest('form.variants').find('strike.price span').html(compare_price);
				$(this).closest('form.variants').find('strike.price').show();
			} else {
				$(this).closest('form.variants').find('strike.price').hide();
			}
			return false;
		});

	});
	</script>
	{/literal}
	
	<form class="variants" action="/cart">
		<div id="product-options-wrapper" class="product-options" {if $product->variants|count<2}style="display: none;"{/if}>
		    <dl>
				<dt><label class="required"><em>*</em>Выберите упаковку:</label></dt>
				<dd>
				    <div class="input-box">
						<select class="select{$product->id} required-entry product-custom-option form-control" name="variant">
							{foreach $product->variants as $v}
								<option id="featured_{$v->id}" value="{$v->id}" {if $v->compare_price > 0}compare_price="{$v->compare_price|convert}"{/if} price="{$v->price|convert}">{if $v->name}{$v->name}{/if}</option>
							{/foreach}
						</select>
					</div>
				</dd>
			</dl>
			<p class="required">* Обязательные поля</p>
    	</div>

		<div class="product-options-bottom">
			<!-- Цена -->
			<div class="price-box">
				<span class="regular-price">                                         
					<strike class="price" {if $product->variant->compare_price==0}style="display: none;"{/if}>Старая цена: <span>{$product->variant->compare_price|convert}</span> {$currency->sign|escape}</strike>
					<span class="price">Цена: <span>{$product->variant->price|convert}</span> {$currency->sign|escape}</span>
				</span>
			</div>

			<div class="price-box">
				{if $user->discount} 
				* Скидка {$user->discount|convert}% будет учтена при оформлении заказа.
				{/if}
			</div>
			<!-- Цена (End)-->

			<div class="add-to-cart">
				<div class="qty-block">
					<label for="qty">Количество:</label>
					<input class="input-text qty form-control" type="text" title="Кол-во" size="2" name="amount" value="1">
				</div>
				
				<input class="button btn-cart" title="Добавить в корзину" type="submit" data-result-text="Добавлено" onclick="yaCounter25367054.reachGoal('productADD2CART'); return true;" value="Добавить в корзину" >

			</div>
		</div>
	</form>
{else}
	<div class="price-box"><span class="regular-price"><span class="price">Скоро будет</span></span></div>
{/if}

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

Спасибо большое. Отлично встало.

Кстати, свой код тоже допилил. Старая цена отображается, но с искажением. Ошибку понял.

 

{if $product->variants|count > 0}

	<div class="clear"></div>
	

	
			<form class="variants" action="/cart">
	<div id="product-options-wrapper" class="product-options">

{foreach $product->variants as $v}
<input id="product_{$v->id}" name="variant" value="{$v->id}" type="radio" {if $product->variant->id==$v->id}checked{/if} style="display:none;"/>
{/foreach}

{if $product->variants|count<2}{else}
    <dl>
<dt><label class="required"><em>*</em>Выберите упаковку:</label></dt>
<dd>
    <div class="input-box">
				<select class="select{$product->id} required-entry product-custom-option form-control" name="variant">
					{foreach $product->variants as $v}
						<option id="featured_{$v->id}"  value="{$v->id}" {if $v->compare_price > 0} compare_price="{$v->compare_price|convert}"{/if} price="{$v->price|convert}"  >{if $v->name}{$v->name}{/if}</option>
					{/foreach}
				</select>
	</div>
</dd>
	</dl>

		<p class="required">* Обязательные поля</p>
{/if}
    </div>

<div class="product-options-bottom">

<!-- Цена -->
<div class="price-box"><span class="regular-price">Цена:                                   
<span class="price">
{if $product->variant->compare_price > 0}
<strike name="price"><div name="compr">{$product->variant->compare_price|convert}</div></strike>
<span name="price">{$product->variant->price|convert}</span>
</span>
{else}
 <span class="price">{$product->variant->price|convert}</span>
{/if}
</span> {$currency->sign|escape}</div>

<div class="price-box">
{if $user->discount} 
* Скидка {$user->discount|convert}% будет учтена при оформлении заказа.
{/if}
</div>
<!-- Цена (End)-->


	<div class="add-to-cart">
		<div class="qty-block">
			<label for="qty">Количество:</label>
			<input class="input-text qty form-control" type="text" title="Кол-во" size="2" name="amount" value="1">
		</div>
			<input class="button btn-cart" title="Добавить в корзину" type="submit" data-result-text="Добавлено" onclick="yaCounter25367054.reachGoal('productADD2CART'); return true;" value="Добавить в корзину" >

	</div>

</div>
			</form>
		{else}
			<div class="price-box"><span class="regular-price"><span class="price">Скоро будет</span></span></div>
		{/if}
		
{literal}
<script>
$(function() {
	// Выбор вариантов
	$('select[name=variant]').change(function() {
		price = $(this).find('option:selected').attr('price');
		compare_price = '';
		if(typeof $(this).find('option:selected').attr('compare_price') == 'string')
		compare_price = $(this).find('option:selected').attr('compare_price');
		$(this).closest('form').find('span.price').html(price);
		$(this).closest('form').find('strike.price').html(compare_price);
		return false;
	});

});
</script>
{/literal}
Изменено пользователем gmyz
Ссылка на сообщение
Поделиться на другие сайты

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

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

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

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

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

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

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

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

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