KDV

Скрипт не AJAX. Как работает: При клике на кнопку в ссылку подставляется &limit=N (отрабатывает совойство location, происходит переход по новой ссылке). Скролит страницу к началу добавленых товаров (если это не необходимо - удалите хвост ссылки "+ '#last-item'" на 31й строке скрипта.) Дизейблит кнопку, если в категории больше нет товаров. При установке скрипта необходимо указать: кол-во товаров для отображения при клике ( 20 по умолчанию ) класс блока обертки товаров класс кнопки (function () { // need jquery > v.3 // add script in 'catalog\view\theme\default\template\product\category.twig' before footer // productWrapperSelector -- selector of product wrapper // productToShow -- product`s quantity to show // productMoreBtnSelector -- selector of add button // config const productToShow = 20; const productWrapperSelector = $('.product-list'); const productMoreBtnSelector = $('.more-product-btn'); // config var moreBtn = productMoreBtnSelector; var totalViewOnload = productWrapperSelector.children('div'); function getProductLimit() { var totalProductInCategory = {{ results }}; var productLeft = totalProductInCategory - totalViewOnload.length; return productLeft; } function viewMoreProduct() { var loc = location.href; var to = loc.search(/&limit/i); loc = loc.substring(0, to); loc.length == 0 ? loc = location.href : loc = loc.substring(0, to); var limit = `&limit=${productToShow + totalViewOnload.length}`; location = loc + limit + '#last-item'; } function setLastProductId() { var lastItemID = totalViewOnload.length - productToShow; $(totalViewOnload[lastItemID]).attr('id', 'last-item'); } function moreBtnView() { moreBtn.text(`еще ${productToShow}`); getProductLimit() <= 0 ? moreBtn.attr('disabled', 'disabled') : ''; getProductLimit() < productToShow ? moreBtn.text(`еще ${getProductLimit()}`) : ''; } moreBtn.click(function (e) { e.preventDefault(); viewMoreProduct(); moreBtnView(); }); function init() { moreBtnView(); getProductLimit(); setLastProductId(); } init(); }()); ссылка на Git