Разный шаг количества товаров в корзине



  • Всем доброго дня!

    Возникла необходимость сделать разный шаг изменения количества товаров в корзине. Например:

    Товар №1 продается только в количестве кратном 0.75
    Товар №2 продается только в количестве кратном 1 (как обычно)

    Когда два товара лежат рядом в корзине кнопки - и + должны изменять количество у товара №1: 0,75..1,5..3..и т.д. у второго соответственно 1..2..3 и т.д.

    Что пробовал:
    Создавал TV в котором указывал нужный мне шаг.
    В чанке shopCartRow создавал кнопки + и - вручную где присваивал value=[[созданное TV c шагом]]

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

    Затем правил файл shopkeeper.js в блок "Добавляет кнопки управления счетчиком для поля" закомментил создание кнопок:

    /*
    el.css( { display: 'inline-block' } );
                        el.before( '<button class="shk_count_button ' + SHK.options.buttons_class + '" type="button">-</button>' );
                        el.after( '<button class="shk_count_button ' + SHK.options.buttons_class + '" type="button">+</button>' );
    */
    

    изменил функцию

    buttons.each( function( ii ){
    
                                $(this)
                                .click( function(){
                                        var cnt = parseInt( el.val() );
                                        if( ii == 0 && cnt > 1 ) el.val( cnt - parseFloat($(this).val()) );// тут вычитаю вместо единицы value 
                                        if( ii == 1 ) el.val( cnt + parseFloat($(this).val()) ); тут плюсую вместо единицы value
                                        if ( typeof callback == 'function' ) { callback( $(this) ); }
                                    }
                                );
    
                            }
    

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

    Первый клик работает как надо - плюсует или вычитает нужную мне цифру, но повторный клик плюсует или вычитает уже нужную мне цифру дважды. Полагаю что это связано с функцией callback, но довести до финала не получается. Подскажите пожалуйста как доработать уже сделанное, либо посоветуйте альтернативный вариант. Нагуглил похожую статью, но видимо содержимое shopkeeper.js сильно отличаются от описанного в этой статье. P.S. у меня Shopkeeper 3.2.5


  • Администраторы

    Я бы отключил стандартный для SHK выбор количества и сделал обычное поле с типом "number".

    <input type="number" name="count[]" value="[[+count]]" step="[[+step]]">
    

    Вешать событие пересчета как-то так:

    $(document).on('change', '#shopCart input[name="count[]"]', function(){
        clearTimeout(window.timer);
        window.timer = setTimeout(SHK.recountItemAll.bind(SHK), 500);
    })
    


  • @Andchir спасибо, очень хороший вариант.

    В своем варианте тоже продолжил эксперименты, если кому то в будущем поможет, то работает такой "костыль":

    if ( el.next('button.shk_count_button').size() == 0 ) {
    
                        el.css( { display: 'inline-block' } );
                        var step = el.siblings(".oneqnt").html();//в чанке shopCartRow в одной ячейке рядом с инпутом это - <span class="oneqnt">[[+shk_oneqnt]]</span>, т.е. TV с шагом, само собой в css у него display:none
                        el.before( '<button class="shk_count_button ' + SHK.options.buttons_class + '"  value=" ' +step+ ' "  type="button">-</button>' );
                        el.after( '<button class="shk_count_button ' + SHK.options.buttons_class + '"  value=" ' +step+ ' "  type="button">+</button>' );
    
                        var buttons = el.parent().find('button.shk_count_button');
                        buttons.each( function( ii ){
    
                                $(this)
                                .click( function(){
                                        var cnt = parseFloat( el.val() );
                                        if( ii == 0 && cnt > 1 ) el.val( cnt - (parseFloat($(this).val())) );//вычитаем value кнопки
                                        if( ii == 1 ) el.val( cnt + (parseFloat($(this).val())) );//плюсуем value кнопки
                                        if ( typeof callback == 'function' ) { callback( $(this) ); }
                                    }
                                );
                            }
                        );
    

    В итоге в ручную создавать кнопки - и + как я писал в теме поста не нужно, они рисуются стандартным методом. Функцией .siblings() мы просто ищем элементы лежащие на одном уровне в ячейке таблицы с инпутом. И когда уже происходит создание кнопки в value ей вставляем значение переменной "step", т.е. нужный нам шаг. В результате после callback двойных срабатываний не будет.



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