Автор Тема: Добавить кнопки +/- к полю ввода количества товара  (Прочитано 127 раз)

10 Июля 2016, 21:09:23
  • Новичок
  • *
  • Сообщений: 13
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Здравствуйте!
С помощью статьи удалось вывести на витрину поле добавления количества товара...
А как подключить теперь кнопки +/- к этому полю? Скопировал код кнопок из файла product.tpl - кнопки появились. Но заставить их работать пока не получается. Пробовал скопировать скрипт из файла product.js в ajax-cart.js - не работает. В js не силен, мягко выражаясь.. Помогите пожалуйста.
11 Июля 2016, 14:11:25
Ответ #1
  • Ветеран
  • *****
  • Сообщений: 2156
  • Репутация: +49/-4
  • Сообщество PrestaShop
    • Просмотр профиля
Проблема в том что странице товара копки привязанны к одному ид, на странице категорий нужно изменить ид элементов на уникальный, так как ид на одной странице можно использовать один раз. Поэтому нужно добавить ид товара к ид кнопки и в js добавлять удалять товар с учетом ид. Была такая тема на форуме.
11 Июля 2016, 23:00:12
Ответ #2
  • Новичок
  • *
  • Сообщений: 13
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
Спасибо. Но к сожалению мало что понял. При просмотре в консоле браузера я вижу такой код html:
<p class="quantity_wanted_p" style="display: inline;">
<input type="text" name="ajax_qty_to_add_to_cart[78]" id="quantity_wanted_78" class="text" value="1" size="2" maxlength="3">

 <a href="#" data-field-qty="ajax_qty_to_add_to_cart[78]" class="btn btn-default button-minus product_quantity_down">
                                                <span>
                                                    <i class="fa fa-minus"></i>
                                                </span>
                                            </a>
<a href="#" data-field-qty="ajax_qty_to_add_to_cart[78]" class="btn btn-default button-plus product_quantity_up">
                                                <span>
                                                    <i class="fa fa-plus"></i>
                                                 </span>
                                            </a>
 </p>
Т.е. "name="ajax_qty_to_add_to_cart[78]"" - это разве не уникальный идентификатор поля ввода количества для каждого товара?
К сожалению, в js вообще почти не разбираюсь - поэтому самостоятельно написать даже такой простой скрипт "счетчика" не в состоянии... ((
Скопировал из файла product.js в ajax-cart.js :
// The button to increment the product value
$(document).on('click', '.product_quantity_up', function(e){
    e.preventDefault();
    fieldName = $(this).data('field-qty');
    var currentVal = parseInt($('input[name='+fieldName+']').val());
if (!allowBuyWhenOutOfStock && quantityAvailable > 0)
quantityAvailableT = quantityAvailable;
else
quantityAvailableT = 100000000;
    if (!isNaN(currentVal) && currentVal < quantityAvailableT)
        $('input[name='+fieldName+']').val(currentVal + 1).trigger('keyup');
    else
        $('input[name='+fieldName+']').val(quantityAvailableT);
});
 // The button to decrement the product value
$(document).on('click', '.product_quantity_down', function(e){
    e.preventDefault();
    fieldName = $(this).data('field-qty');
    var currentVal = parseInt($('input[name='+fieldName+']').val());
    if (!isNaN(currentVal) && currentVal > 1)
        $('input[name='+fieldName+']').val(currentVal - 1).trigger('keyup');
    else
        $('input[name='+fieldName+']').val(1);
});
-не работает
11 Июля 2016, 23:30:16
Ответ #3
  • Новичок
  • *
  • Сообщений: 13
  • Репутация: +0/-0
  • Сообщество PrestaShop
    • Просмотр профиля
все-таки смог кое-как...
// The button to increment the product value
$(document).on('click', '.product_quantity_up', function(e){
    e.preventDefault();
 var $input = $(this).parent().find('input');
        $input.val(parseInt($input.val()) + 1);
        $input.change();
        return false;
});
 // The button to decrement the product value
$(document).on('click', '.product_quantity_down', function(e){
    e.preventDefault();
var $input = $(this).parent().find('input');
        var count = parseInt($input.val()) - 1;
        count = count < 1 ? 1 : count;
        $input.val(count);
        $input.change();
        return false;
});