У меня есть следующая задача: у меня есть один пейджер TYPO3 с онлайн-магазином. Магазин сделан с тележкой-удлинителем. Теперь я должен сделать функциональность фильтра, которая позволяет фильтровать продукты, если им назначена категория sys_category TYPO3. Это само по себе не будет большой проблемой, но это становится сложным. Магазин отображает только 10 товаров за раз, переключаясь между другими продуктами с jquery нумерацией страниц. Разбивка на страницы работает над контейнером div, который включает в себя 10 продуктов. Это означает, что я должен перестроить контейнерный div и продукты, когда я использую фильтр Кроме того, есть видео, перекрывающее контент каждый раз, когда вы перезагружаете страницу. Поэтому мне нужно использовать ajax для перестройки контейнера-div.
Проблема, с которой я сейчас сталкиваюсь, заключается в том, что мой вызов ajax всегда возвращает пустое значение, и я не могу понять, почему. Может кто-нибудь помочь мне?
Машинопись:
ajaxFilter = PAGE
ajaxFilter {
typeNum = 2278002
config {
disableAllHeaderCode = 1
xhtml_cleaning = 0
admPanel = 0
debug = 0
no_cache = 1
}
10 < tt_content.list.20.cartproducts_product
}
JQuery:
function filter() {
var form = $('.filter-wrap form');
var data = form.serializeObject();
var url = form.attr("action");
$.ajax({
async: "true",
url: url,
type: "POST",
dataType: 'html',
data: data,
success: function(data) {
$("#c20").html(data);
},
});
}
HTML Фильтр
<div class="filter-wrap">
<f:form pageUid="{pid}" extensionName="Cart" pluginName="Products" controller="Product"
action="ajaxFilter" method="post" pageType="2278002" additionalAttributes="{onchange:
'filter()'}">
<div class="filter-kategorie filter-radio">
<div class="filter-radio-title">
Kategorie
</div>
<div class="filter-radio-items">
<div>
<input type="radio" id="kat-alle" name="kategorie" value="0" checked />
<label for="kat-alle">Alle</label>
</div>
<div>
<input type="radio" id="kat-schluesselanhaenger" name="kategorie" value="1" />
<label for="kat-schluesselanhaenger">Schlüsselanhänger</label>
</div>
<div>
<input type="radio" id="kat-kerzenstaender" name="kategorie" value="2" />
<label for="kat-kerzenstaender">Kerzenständer</label>
</div>
<div>
<input type="radio" id="kat-lederwaren" name="kategorie" value="3" />
<label for="kat-lederwaren">Lederwaren</label>
</div>
<div>
<input type="radio" id="kat-schubladengriffe" name="kategorie" value="4" />
<label for="kat-schubladengriffe">Schubladengriffe</label>
</div>
</div>
</div>
<div class="filter-material filter-radio">
<div class="filter-radio-title">
Material
</div>
<div class="filter-radio-items">
<div>
<input type="radio" id="mat-alle" name="material" value="0" checked />
<label for="mat-alle">Alle</label>
</div>
<div>
<input type="radio" id="mat-metall" name="material" value="7" />
<label for="mat-metall">Metall</label>
</div>
<div>
<input type="radio" id="mat-holz" name="material" value="8" />
<label for="mat-holz">Holz</label>
</div>
<div>
<input type="radio" id="mat-leder" name="material" value="9" />
<label for="mat-leder">Leder</label>
</div>
</div>
</div>
</f:form>
</div>
PHP Расширение корзины XClass Productcontroller
class ProductController extends \Extcode\CartProducts\Controller\ProductController
{
protected function createDemandObjectFromAjax($kategorie, $material)
{
/** @var \Extcode\CartProducts\Domain\Model\Dto\Product\ProductDemand $demand */
$demand = $this->objectManager->get(
\Extcode\CartProducts\Domain\Model\Dto\Product\ProductDemand::class
);
if ($this->searchArguments['sku']) {
$demand->setSku($this->searchArguments['sku']);
}
if ($this->searchArguments['title']) {
$demand->setTitle($this->searchArguments['title']);
}
if ($settings['orderBy']) {
$demand->setOrder($settings['orderBy'] . ' ' . $settings['orderDirection']);
}
$this->addCategoriesToDemandObjectFromAjax($demand, $kategorie, $material);
return $demand;
}
/**
* @param \Extcode\CartProducts\Domain\Model\Dto\Product\ProductDemand $demand
*/
protected function addCategoriesToDemandObjectFromAjax(&$demand, $kategorie, $material)
{
$selectedCategories = [$kategorie, $material];
$categories = [];
if ($this->settings['listSubcategories']) {
foreach ($selectedCategories as $selectedCategory) {
$category = $this->categoryRepository->findByUid($selectedCategory);
$categories = array_merge(
$categories,
$this->categoryRepository->findSubcategoriesRecursiveAsArray($category)
);
}
} else {
$categories = $selectedCategories;
}
$demand->setCategories($categories);
}
/**
* action list
*/
public function ajaxFilterAction()
{
$demand = $this->createDemandObjectFromAjax($_POST['kategorie'],$_POST['material']);
$demand->setActionAndClass(__METHOD__, __CLASS__);
$products = $this->productRepository->findDemanded($demand);
$this->view->assign('searchArguments', $this->searchArguments);
$this->view->assign('products', $products);
$this->view->assign('cartSettings', $this->cartSettings);
$this->assignCurrencyTranslationData();
$this->addCacheTags($products);
}
}
Ссылка на страницу (для Livedemo) https://medieval-crafts.redspace.dev/
Вводное видео отключено из-за упрощения разработки.