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

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

Спасибо.буду пробовать

http://dimox.name/jquery-form-styler/

а их уже через стили подрихтовать без труда можно

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

можно и без jQuery.

вывести варианты так:

<form class="variants" action="/cart">
{foreach $product->variants as $v}
	<label>
		<input name="variant" value="{$v->id}" type="radio"><span>{$v->name}</span>
	</label>
{/foreach}
<input type="submit" style="float:right;" class="totocart" value="в корзину" data-result-text="добавлено"/>
</form>

и в css 

.variants input[type="radio"] {display: none;}
.variants label {display:inline-block;}
.variants input[type="radio"]+span {
  	padding: 6px;	
 	color:#000;
}
.variants input[type="radio"]:checked+span { 
	background: #000;
 	color: #fff;
}
Изменено пользователем mishanya
Ссылка на сообщение
Поделиться на другие сайты

 

можно и без jQuery.

вывести варианты так:

<form class="variants" action="/cart">
{foreach $product->variants as $v}
	<label>
		<input name="variant" value="{$v->id}" type="radio"><span>{$v->name}</span>
	</label>
{/foreach}
<input type="submit" style="float:right;" class="totocart" value="в корзину" data-result-text="добавлено"/>
</form>

и в css 

.variants input[type="radio"] {display: none;}
.variants label {display:inline-block;}
.variants input[type="radio"]+span {
  	padding: 6px;	
 	color:#000;
}
.variants input[type="radio"]:checked+span { 
	background: #000;
 	color: #fff;
}

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

Ссылка на сообщение
Поделиться на другие сайты
<h3 id="price">{$product->variant->price}</h3>
<form class="variants" action="/cart">
	{foreach $product->variants as $v}
		<label>
			<input name="variant" value="{$v->id}" type="radio" data-id="{$v->id}" data-price="{$v->price}"><span>{$v->name}</span>
		</label>
	{/foreach}
	<input type="submit" class="tocart" value="в корзину" data-result-text="добавлено"/>
</form>

ниже сразу:

 

{literal}
<script>
	$(function() {
		$(".variants label").live("click", function(){
			variant = $(this).find('input').data('id'); 
			price   = $(this).find('input').data('price');

			$('h3#price').html(price);
		});
	});
</script>
{/literal}

и те же стили

.variants input[type="radio"] {display: none;}
.variants label {display:inline-block;}
.variants input[type="radio"]+span {
  	padding: 6px;	
 	color:#000;
}
.variants input[type="radio"]:checked+span { 
	background: #000;
 	color: #fff;
}
Ссылка на сообщение
Поделиться на другие сайты

 

<h3 id="price">{$product->variant->price}</h3>
<form class="variants" action="/cart">
	{foreach $product->variants as $v}
		<label>
			<input name="variant" value="{$v->id}" type="radio" data-id="{$v->id}" data-price="{$v->price}"><span>{$v->name}</span>
		</label>
	{/foreach}
	<input type="submit" class="tocart" value="в корзину" data-result-text="добавлено"/>
</form>

ниже сразу:

 

{literal}
<script>
	$(function() {
		$(".variants label").live("click", function(){
			variant = $(this).find('input').data('id'); 
			price   = $(this).find('input').data('price');

			$('h3#price').html(price);
		});
	});
</script>
{/literal}

и те же стили

.variants input[type="radio"] {display: none;}
.variants label {display:inline-block;}
.variants input[type="radio"]+span {
  	padding: 6px;	
 	color:#000;
}
.variants input[type="radio"]:checked+span { 
	background: #000;
 	color: #fff;
}

спасибо большое

все работает

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

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

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

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

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

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

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

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

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

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