Изменени кол-ва товара в корзине кнопками + и -

Ребят, привет, подскажите с js, пытаюсь кнопочки + и — настроить на изменение кол-ва товара в корзине, джава отвечающая за работу кнопочек такая:

$('.btn-num-product-down').on('click', function(e){
        e.preventDefault();
        var numProduct = Number($(this).next().val());
        if(numProduct > 1) $(this).next().val(numProduct - 1);
    });

    $('.btn-num-product-up').on('click', function(e){
        e.preventDefault();
        var numProduct = Number($(this).prev().val());
        $(this).prev().val(numProduct + 1);
    });

в чанке вывожу таким образом:

<td class="column-4">
  <div class="flex-w bo5 of-hidden w-size17">
	<form method="post" class="ms2_form form-inline" role="form">
	  <input type="hidden" name="key" value="{$product.key}"/>

	  <button class="btn-num-product-down color1 flex-c-m size7 bg8 eff2">
		<i class="fs-12 fa fa-minus" aria-hidden="true"></i>
	  </button>
	  <input class="num-product size8 m-text18 t-center" type="number" name="count" value="{$product.count}">
	  <button class="btn-num-product-up color1 flex-c-m size7 bg8 eff2">
		<i class="fs-12 fa fa-plus" aria-hidden="true"></i>
	  </button>

	  <button class="btn btn-default" type="submit" name="ms2_action" value="cart/change"></button>
	</form>
  </div>
</td>

Борис

05 апреля 2018, 19:03

1 404

Комментарии: 4

Алексей

06 апреля 2018, 11:45

Добрый день!
Здесь на сайте есть готовое решение по поводу +-. Я делал уже. Если не найдете, напишите, я посмотрю как у меня было сделано.

Борис

11 апреля 2018, 11:37

Да, тоже нашел и использовал его.

Константин

11 апреля 2018, 11:47

Сбросьте ссылочку, пожалуйста, тоже нужно.

Борис

11 апреля 2018, 13:01

Пожалуйста modx.pro/help/8315/#comment-58166
Под свою задачку если интересно сделал так:

В чанке корзины вывод:

<form method="post" class="ms2_form form-inline" role="form">
  <input type="hidden" name="key" value="{$product.key}"/>
  
  <button class="minus color1 flex-c-m size7 bg8 eff2" data-extend="{$product.id}">
	<i class="fs-12 fa fa-minus" aria-hidden="true"></i>
  </button>
  
  <input type="text" id="count{$product.id}" class="num-product size8 m-text18 t-center" min="1" title="Количество" value="{$product.count}" name="count">
  
  <button class="plus color1 flex-c-m size7 bg8 eff2" data-extend="{$product.id}">
	<i class="fs-12 fa fa-plus" aria-hidden="true"></i>
  </button>
  
  <button class="btn btn-default" type="submit" name="ms2_action" value="cart/change">
	<i class="glyphicon glyphicon-refresh"></i>
  </button>
</form>

И скрипт собственно запихнул в шаблон корзины:

<script>
  $(document).ready(function(){
	
	$('.minus').bind('click', function()
					 {
					   var itemNum = $(this).attr('data-extend');
					   var c = $("#count"+itemNum).val();
					   c--;
					   $("#count"+itemNum).val(c);
					   
					   var count = parseInt($("#count"+itemNum).val());
					   var id = '#' + $( this ).closest( 'tr' ).attr( 'id' );
					   var price = parseInt( $( id + ' .price-row' ).text().replace( /\s+/g, '' ) );
					   $( id + ' .price-sum' ).html( count * price );
					   
					 });
	
	$(".plus").click(function()
					 {
					   var itemNum = $(this).attr('data-extend');
					   var c = $("#count"+itemNum).val();
					   c++;
					   $("#count"+itemNum).val(c);
					   
					   var count = parseInt($("#count"+itemNum).val());
					   var id = '#' + $( this ).closest( 'tr' ).attr( 'id' );
					   var price = parseInt( $( id + ' .price-row' ).text().replace( /\s+/g, '' ) );
					   $( id + ' .price-sum' ).html( count * price );
					   
					 });
	
  });	  
</script>

Правда скрипт немного модифицированный, он еще общую сумму по каждому товару выводит у меня.

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