basket.basket.small
Возможно кто-то из Вас при создании интернет магазина на 1С Битрикс сталкивался с проблемой такого рода. Если включить на сайте работающем на платформе 1С Битрикс: «Управление сайтом» расширенный режим управления ценами и настроить некоторые товары таким образом чтобы их нельзя было купить поштучно (от 10 штук), то при добавлении такого товара в корзину покупателя, малая корзина (bitrix:sale.basket.basket.small) будет отображать данные не правильно (будет показывать не 10 товаров в корзине а один), вплоть до перехода на страницу корзины (например /personal/basket/…) и дополнительного обновления страницы.
Такая ситуация может вводить клиента в заблуждение и приводить к снижению конверсии и потере прибыли. Для исправления этого бага, я написал Ajax обработчик кнопки «Купить» (Добавить в корзину) используя методы Jquery Click(), Attr() а также $.post() . Общая схема взаимодействия представлена на рисунке ниже:
В общем всё действие разбито на 3 шага. Во-первых при нажатии на кнопку купить считываем минимально необходимые для работы данные а именно ID товара и минимальное количество которое можно купить (оно устанавливается в карточке товара в расширенном режиме управления цен) и передаём их в обработчик. Php скрипт обработчика вызывает метод Bitrix Framework Add2BasketByProductID(ID,QUANTITY), который добавляет товар в корзину, а следом вызывается компонент bitrix:sale.basket.basket.small. В результате php обработчик вернёт нам HTML код малой корзины покупателя с корректными данными. В третьих нам остаётся лишь заменить этот HTML код в контейнере с нынешней малой корзиной, для этого прекрасно подойдёт метод jqurty Html(). Ниже приведён код php обработчика:
?
if(Add2BasketByProductID($_POST["PRODUCT_ID"],$_POST["QUANTITY"]))
{
$APPLICATION->IncludeComponent("bitrix:sale.basket.basket.small", "happy_cart", array(
"PATH_TO_BASKET" => "/personal/cart/",
"PATH_TO_ORDER" => "/personal/order.php"
),
false
);
}
и JavaScript:
?
$(document).ready(function(){
$(".services.addToCart.onMain a").click(function(){
//Считываем данные для отправки в обработчик
var ProductID = $(this).parent().attr("id");
var ProductName = $(this).parent().attr("name");
var ProductPrice = $(this).parent().attr("price");
var ProductQuantity = $(this).parent().attr("quantity");
$.post(
"/ajax/ajax_add_element_in_cart.php",
{
//Массив с данными для отправки
PRODUCT_ID:ProductID,
PRICE:ProductPrice,
CURRENCY:"RUB",
LID:"s1",
NAME:ProductName,
QUANTITY:ProductQuantity
},
//Вызов функции после получения ответа от php скрипта
onAjaxAdd2BasketSuccess
);
function onAjaxAdd2BasketSuccess(data)
{
alert("Товар добавлен в корзину");
//Заменяем HTML код малой корзины
$(".basket-small-container").html(data);
}
});
});
Ну всё теперь мы не вводим пользователя в заблуждение и он сразу видит реальную информацию в малой корзине.
Свои вопросы вы можете задавать в комментариях к посту. Успехов Вам!
Присоединяйтесь — мы покажем вам много интересного
Присоединяйтесь к ОК, чтобы подписаться на группу и комментировать публикации.
Нет комментариев