Кнопки у shk-count

Здравствуйте. Делаю корзину, у input с классом shk-count автоматом подключаются кнопки, с помощью которых можно регулировать количество товара к заказу, но эти кнопки появляются с помощью скрипта. В этом скрипте я поменял css классы, необходимые мне для моих кнопок, но сами кнопки создаются до и после самого input, а у меня input лежит в обвертке, и мне нужно что бы кнопки генерировались не после самого input, а после обвертки. Вот мой код по верстке:

<div class="amountSelect">
    <button class="button button--white button--transparent amountSelect__button" role="button" type="submit">
         <span class="button__text">
                                -
         </span>
    </button>
    <span class="input amountSelect__input">
              <span class="input__box">
                      <input class="input__control amountSelect__control" placeholder="">
               </span>
   </span>
    <button class="button button--white button--transparent amountSelect__button" role="button" type="submit">
               <span class="button__text">
                              +
               </span>
     </button>
</div>

Скрипт кладет button в контейнер input__box, а нужно вне его. Подскажите, не хватает знания JS что бы найти в коде место, где генерируется этот код, что бы можно было подправить под себя

Если вы хотите заменить кнопки, то вам нужно отключить стандартные кнопки (есть для этого параметр), добавить свои кнопки и навесить на них действия на клик. Я думаю не будет сложно увеличить циферку в поле. А после этого нужно вызвать функцию

SHK.recountItemAll();

Участник @andchir написал в Кнопки у shk-count:

SHK.recountItemAll();

Спасибо за ответ.
Попробовал, но пока не получилось. Что я делаю:
Отключил во всех наборах параметров параметры counterField, counterFieldCart и oCounter(включена)
Нашел функцию, которая меняет значения в инпате:

$(document).ready(function() {
    $('.button--minus').on("click", function () {
        var $input = $(this).parent().find('.shk-count');
        var count = parseInt($input.val()) - 1;
        count = count < 1 ? 1 : count;
        $input.val(count);
        $input.change();
        return false;
    });

    $('.button--plus').on("click",function () {
        var $input = $(this).parent().find('.shk-count');
        $input.val(parseInt($input.val()) + 1);
        $input.change();
        return false;
    });
});

Далее я вешаю на кнопки событие на клик, инлайно

<button class="button button--white button--transparent button--minus amountSelect__button" role="button" type="submit" onclick="SHK.recountItemAll();">
                <span class="button__text">
                    -
                </span>
</button>

В таком случае происходит следующее: при загрузке страницы все хорошо, после нажатия на кнопоки с изменением ценой на секунду значение в инпате меняется, далее оно сбрасывается опять к единице и появляются дополнительные button, которые я вроде бы отключил в наборах параметров, но они все равно появляются
При загрузке
0_1517999211234_bf38beb2-942f-4eeb-9ee0-42d7cbc15a09-image.png
После нажатия:
0_1517999248604_53e39f4b-797d-432f-8677-f600fe905efb-image.png
После второго нажатия меня перекидывает по адресу site/#shopCart

Попробовал добавить функцию пересчета сразу в скрипт изменения значения в инпате:

$(document).ready(function() {
    $('.button--minus').on("click", function () {
        var $input = $(this).parent().find('.shk-count');
        var count = parseInt($input.val()) - 1;
        count = count < 1 ? 1 : count;
        $input.val(count);
        $input.change();
        SHK.recountItemAll();
        return false;
    });

    $('.button--plus').on("click",function () {
        var $input = $(this).parent().find('.shk-count');
        $input.val(parseInt($input.val()) + 1);
        $input.change();
        SHK.recountItemAll();
        return false;
    });
});

Ситуация та же самая
Я новичек в JS наверное что-то не правильно делаю. Так же вот еще пробовал такой вариант:

$(document).ready(function() {
    $('.button--minus').on("click", function () {
        var $input = $(this).parent().find('.shk-count');
        var count = parseInt($input.val()) - 1;
        count = count < 1 ? 1 : count;
        $input.val(count);
        $input.change();
    }).SHK.recountItemAll();

    $('.button--plus').on("click",function () {
        var $input = $(this).parent().find('.shk-count');
        $input.val(parseInt($input.val()) + 1);
        $input.change();
    }).SHK.recountItemAll();  
});



Ну такое совсем не работает. Подскажите пожалуйста, что не так делаю?

Развел по разным событиям, но все равно не работает:

$(document).ready(function() {

    $('.button--minus').on("click", function () {
        var $input = $(this).parent().find('.shk-count');
        var count = parseInt($input.val()) - 1;
        count = count < 1 ? 1 : count;
        $input.val(count);
        $input.change();
        return false;
    });

    $('.button--plus').on("click",function () {
        var $input = $(this).parent().find('.shk-count');
        $input.val(parseInt($input.val()) + 1);
        $input.change();
        return false;
    });
    
    $('.shk-count').on('change', function () {
         SHK.recountItemAll();
    });
});

Покажите как добавили кнопки (полный код чанка).

Скрипт самый правильный у вас написан после слов

Попробовал добавить функцию пересчета сразу в скрипт изменения значения в инпате:

@andchir
Вот полный код корзины:

<div class="checkoutOffers layout__row" data-shopcart="2">
<b>ПУстая корзина - Добавьте товар</b>
</div>
<!--tpl_separator-->
<div class="checkoutOffers layout__row" data-shopcart="2">
<form action="[[+this_page_url]]#shopCart" method="post" class="form">
[[+inner]]
</form>
</div>

Вот код для строки, для [[+inner]]:

<div class="checkoutOffer">
    <div class="checkoutOffer__inner">

    <div class="checkoutOffer__item checkoutOffer__item--type--number">
        <span class="checkoutOffer__number">[[+num]]</span>
    </div>
    <div class="checkoutOffer__item checkoutOffer__item--type--img">
        <a href="[[+url]]" class="link"><img src="[[+product__mainImage]]" alt="" class="img checkoutOffer__img"></a>



    </div>
    <div class="checkoutOffer__item checkoutOffer__item--type--content">
        <div class="checkoutOffer__itemTitle">
            <div class="title checkoutOffer__itemName">[[+name]]</div>
            <div class="checkoutOffer__itemPrice">ЦЕНА: [[+product__price]] </div>
            
            
            
        </div>
    </div>
    <div class="checkoutOffer__item checkoutOffer__item--type--count">
        <div class="checkoutOffer__quantity">
            <div class="amountSelect">

            <button class="button button--white button--transparent button--minus amountSelect__button" role="button" type="submit">
                <span class="button__text">
                    -
                </span>
            </button>

            <span class="input amountSelect__input">
                    <span class="input__box">
                        <input class="input__control amountSelect__control shk-count" type="text" size="2" maxlength="3" title="изменить количество" value="[[+count]]">
                    </span>
            </span>

            <button class="button button--white button--transparent button--plus amountSelect__button" role="button" type="submit">
                <span class="button__text">
                  +
                </span>
            </button>

 
            </div>
        </div>
    </div>
    <div class="checkoutOffer__item checkoutOffer__item--type--del">
        <div class="checkoutOffer__delete">
            <a href="#" class="image imageDelete">

            </a>
        </div>
    </div>
    </div>  

</div>  

Я пробовал еще вчера, со стандартными кнопками работает все хорошо

Откатился назад, настроил все заново. Провел эксперимент - Делаю со стандартными чанками, с включенными кнопками для количества - все работает. Отключаю кнопки, добавляю их в стандартный чанк вручную, в таком виде, в котором бы эти кнопки добавил JS:

        <button class="shk_count_button" type="button">-</button>
        <input class="shk-count" type="text" size="2" name="count[]" maxlength="3" title="изменить количество" value="[[+count]]" />
        <button class="shk_count_button" type="button">+</button>


В таком виде кнопки ничего не делают. Добавляю к стандартным кнопка необходимые для моего скрипта стили (button--minus, button--plus), что бы значение в инпате изменялось моим скриптом, хтмл:

<tr class="cart-order">
    <td align="left"><b><a href="[[+url]]">[[+name]]</a></b> [[+addit_data]]</td>
    <td>[[+price]] [[+currency]]</td>
    <td>
        <button class="shk_count_button button--minus" type="button">-</button>
        <input class="shk-count" type="text" size="2" name="count[]" maxlength="3" title="изменить количество" value="[[+count]]" />
        <button class="shk_count_button button--plus" type="button">+</button>
    </td>
    <td align="right">
        <a href="[[+url_del_item]]" title="Удалить" class="shk-del"><img src="assets/components/shopkeeper3/web/css/default/delete.gif" width="17" height="17" alt="Удалить" /></a>
    </td>
</tr>

JS:

$(document).ready(function() {
    $('.button--minus').on("click", function () {
        var $input = $(this).parent().find('.shk-count');
        var count = parseInt($input.val()) - 1;
        count = count < 1 ? 1 : count;
        $input.val(count);
        $input.change();
        SHK.recountItemAll();
        return false;
    });

    $('.button--plus').on("click",function () {
        var $input = $(this).parent().find('.shk-count');
        $input.val(parseInt($input.val()) + 1);
        $input.change();
        SHK.recountItemAll();
        return false;
    });
});

После этого, при нажатии на кнопку изменения кол-ва, на секунду значение в инпате меняет, появляется лоадер, но тут же пропадает и значение возвращается на изначальное, при повторных нажатиях уже ничгео не происходит.

Сделал все со стандартными чанками, чтобы избежать своих ошибок, но все равно чего-то не хватает. Подскажите, что еще можно попробовать?

@andchir Попробовал немного по-другому.
Если оставить кнопки включенными по умолчанию, то когда мы меняем значение товара не кнопкой, а вручную, вписывая значение в инпат, то пересчет работает.
Я попробовал менять значение в инпате своими кнопками и скриптом, но уже без вызова SHK.recountItemAll();, в надежде, что после изменения в инпате, значение само пересчитается. Однако этого не происходит, опять после нажатия на свою кнопку значение на малое время изменяется, появляется лоадер, значение возвращается в первичное состояния, при повторных нажатиях уже значение не меняется. Уже не знаю что и пробовать

Где можно посмотреть?

@andchir
Ссылку напишу в приват.
Сейчас поставил набор параметров для корзины, по умолчанию.
0_1518204495214_5fa768f6-51b8-461a-934e-8f8d6dabd330-image.png

У этого набора только шаблоны прописаны вручную, в новые чанки, что бы не работать с исходными
0_1518204451749_0075112b-5d6d-4efd-bff2-0fd02021bc54-image.png
Стандартные конпки включены, плюс к ним, в чанке cart__row--self добавлены свои кнопки. Скрипт к своим конпкам сейчас в таком виде:

$(document).ready(function() {
    $('.button--minus').on("click", function () {
        var $input = $(this).parent().find('.shk-count');
        var count = parseInt($input.val()) - 1;
        count = count < 1 ? 1 : count;
        $input.val(count);
        $input.change();
        SHK.recountItemAll();
        return false;
    });

    $('.button--plus').on("click",function () {
        var $input = $(this).parent().find('.shk-count');
        $input.val(parseInt($input.val()) + 1);
        $input.change();
        SHK.recountItemAll();
        return false;
    });
});
  1. Вместо $('.button--plus').on('click' лучше писать что-то вроде $('[data-shopcart="3"]').on('click', '.button--plus' чтобы после обновления корзины эти события оставались привязанными к кнопкам.

  2. Нужно убрать вторую корзину на странице. С двумя корзинами скрипт более сложный.

Добрый день. Переделала корзину и так-же вывела кнопки через html. И при первом клике цены обновляются, но при втором клике перекидывает на страницу товара, в чем может быть проблема? Сайт: http://ct23424fd.tmweb.ru/

И при первом клике цены обновляются, но при втором клике перекидывает на страницу товара

Причина в том, что вы не последовали моему первому совету.

@andchir Пробовала так-же не работает(((

И так пробовала, на первый клик корзина обновляется, при втором перекидывает на главную.
$(document).on('change', '[data-shopcart] .shk-count', function () {
SHK.recountItemAll();
return false;
});

Пробовала так-же не работает(((

Как пробовали?

Похоже, подключение к Форум | MODX Shopkeeper было разорвано, подождите, пока мы пытаемся восстановить соединение.