Последние темы


Кнопки у 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;
    });

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

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

 

Последние комментарии

  • M

    @Andchir , спасибо. Проблема и правда была в одном из плагинов, который на другом сайте нормально работает

    Читать далее
  • Что нового в Shopkeeper 4.0.3:

    Исправлено некорректное определение языка по умолчанию В настройках в админке скрываются пароли. Добавлена возможность загружать картинки для категорий. shopkeeper.js - добавлена функция updateProductsPrice() для поддержки текстовых полей для цены. Twig-функции contentList() и includeContent() вынесены в отдельный класс. Добавлено событие "order.before_create". Сортировка всех полей типа контента перетаскиванием. Автоматическое сохранение сортировки полей при сохранении типа контента (не нужно нажимать на отдельную кнопку). В интерфейсе админа добавлено поле поиска для списка Composer-пакетов.

    Скачать можно на главной странице https://modx-shopkeeper.ru/

    Читать далее
  • Вот этот плагин:
    0_1550334109280_screenshot_022.png

    Вроде по умолчанию он выключен. Надо включить. Но плагин работает только на редактирование товаров, при удалении он делалать ничего не будет. Только что проверил кнопку, всё работает корректно, фильтры удаляются и добавляются, когда нужно. Но нужно очищать корзину после удаления товаров (возможно баг).

    Читать далее
  • J

    @Andchir Если нажимаю кнопочку "Обновить значения", то в фильтрах появляются как раз те самые удаленные значения фильтра.. Потом приходится Ручками выбирать эти удаленные значения.
    вот так выглядит Управление фильтрами когда удаляешь ручками: https://yadi.sk/i/_zw64CGkZ_sAYg
    А вот так выглядит когда просто нажимаешь "Обновить значения": https://yadi.sk/i/7WFbXC6xV5sQAw (красным выделено, то что приходится постоянно удалять

    Читать далее