Button + и - для выбора количества товаров в корзине

[esistema1]

Всем здравствуйте, прошу помощи...

 

Simpla 1.4

 

Код вывода select в корзине для выбора количества товаров

 <select style="width:40px;" name=amounts[{$variant->variant_id}] onchange="document.cart.submit_order.value='0'; document.cart.submit();">
{section name=amounts start=1 loop=$variant->stock+1 step=1 max=100}
<option value="{$smarty.section.amounts.index}" {if $variant->amount==$smarty.section.amounts.index}selected{/if}>{$smarty.section.amounts.index}</option>{/section}</select>   

 

 

Хочу сделать вместо select - button (кнопки + и - для редактирования количества товаров).

 

<button class="" title="Добавить товар" type="submit">+</button>

 

 

Подскажите пожалуйста как это реализовать?

[Noxter]

На JS, к примеру:

$('.price .plus').on('click', function(sa){

	var amount = parseInt($('input[name=amount]').val());

	$(this).parent().find('input[name=amounts]').val(++amount);

});

$('.price .minus').on('click', function(sa){

	var amount = parseInt($('input[name=amount]').val());

	$(this).parent().find('input[name=amounts]').val((amount-1<0)?amount:--amount);

});

P.S. SA - аббревиатура обозначающая Simpla-Addons

[esistema1]

а можно немного подробнее как прикрутить это к сайту?

[Noxter]

а можно немного подробнее как прикрутить это к сайту?

Немного подробнее учите матчасть.

[esistema1]

Спасибо за помощь...

[Noxter]

Спасибо за помощь...

Всегда пожалуйста!

[esistema1]

Вопрос к знатокам...

 

Вставляем скрипт в шаблон...

 {literal}
<script type="text/javascript">
$('.price .plus').on('click', function(sa){  var amount = parseInt($('input[name=amount]').val());  $(this).parent().find('input[name=amounts]').val(++amount);});
  
$('.price .minus').on('click', function(sa){  var amount = parseInt($('input[name=amount]').val());  $(this).parent().find('input[name=amounts]').val((amount-1<0)?amount:--amount);});
</script>
{/literal}

 

Вставляем input..

<input onclick="ЧТО ТУТ НАПИСАТЬ" class="" title="Добавить одну позицию" type="submit" value="-"/>  

 

 

Если все верно то подскажите что написать в onclick чтобы связать его со скриптом?

[Noxter]

<div class="price">

<button type="button" class="plus" title="Добавить одну позицию">+</button>

<input name="amounts[{$variant->variant_id}]" value="{$purchase->amount}">

<button type="button" class="minus" title="Убавить одну позицию">-</button>

</div>

[esistema1]

Не работает...

 

Вместо {$purchase->amount} написал {$variant->amount} (у меня simpla 1.4)

Изменено 22 июня, 2017 пользователем esistema1

[esistema1]

Сделал, другим путем. Может кому пригодится готовое решение.

 

В шапке подключаем jQuery библиотеку и добавляем такой код

{literal}
    <script type="text/javascript" >
        $(document).ready(function() {
            $('.minus').click(function () {
                var $input = $(this).parent().find('input');
                var count = parseInt($input.val()) - 1;
                count = count < 1 ? 1 : count;
                $input.val(count);
                $input.change();
                return false;
            });
            $('.plus').click(function () {
                var $input = $(this).parent().find('input');
                $input.val(parseInt($input.val()) + 1);
                $input.change();
                return false;
            });
        });
{/literal}

 

 

Вставляем в cart.tpl вывод кнопок:

<div class="number">
<button type="button" class="minus" title="Убрать одну позицию">-</button>   
<input type="text" onchange="document.cart.submit_order.value='0'; document.cart.submit();" name="amounts[{$variant->variant_id}]" value="{$variant->amount}">
<button type="button" class="plus" title="Добавить одну позицию">+</button>
 </div>     

[Noxter]

Молодец!

[Gruzin]

 

Сделал, другим путем. Может кому пригодится готовое решение.

 

В шапке подключаем jQuery библиотеку и добавляем такой код

{literal}
    <script type="text/javascript" >
        $(document).ready(function() {
            $('.minus').click(function () {
                var $input = $(this).parent().find('input');
                var count = parseInt($input.val()) - 1;
                count = count < 1 ? 1 : count;
                $input.val(count);
                $input.change();
                return false;
            });
            $('.plus').click(function () {
                var $input = $(this).parent().find('input');
                $input.val(parseInt($input.val()) + 1);
                $input.change();
                return false;
            });
        });
{/literal}

 

 

Вставляем в cart.tpl вывод кнопок:

<div class="number">
<button type="button" class="minus" title="Убрать одну позицию">-</button>   
<input type="text" onchange="document.cart.submit_order.value='0'; document.cart.submit();" name="amounts[{$variant->variant_id}]" value="{$variant->amount}">
<button type="button" class="plus" title="Добавить одну позицию">+</button>
 </div>     

Я конечно не очень разбираюсь , но по моему или не хватает закрывающего </script> или лишний открывающий <script type="text/javascript" >