Заголовок фильтра - раскрывающийся список

[smn85]

Добрый день всем.

 

Хочу сделать, чтобы в фильтре заголовки (производитель, стиль, цвет итп) раскрывали список параметров только по клику, просто всего параметров слишком много, список получается километровый.

 

Использую нешаблонную тему, но фильтр вроде бы практически стандартный (в списке модулей он выводится как Layered Navigation, обновляет страницу без перезагрузки, используется ajax), по крайней мере проблема с корявым отбором товаров при клике на несколько параметров решилась после установки патча для стандартного фильтра.

 

В файле oclayerednavigation.tpl вывод идет здесь:

<?php foreach ($filter_groups as $filter_group) { ?>
    <div class="filter-attribute-container">
        <div class="layered-title"><h2><?php echo $filter_group['name']; ?></h2></div>
        <div class="layered-content">
            <div id="filter-group<?php echo $filter_group['filter_group_id']; ?>">
                <ul>
                <?php foreach ($filter_group['filter'] as $filter) { ?>
                <?php $filter_id = $filter['filter_id']; ?>
                <?php if (in_array($filter['filter_id'], $filter_category)) { ?>
                    <!-- Not show filter attribute -->
                <?php } else { ?>
                    <li><a class="a-filter add-filter" href="javascript:void(0);" name="<?php echo $filter_id ?>"><?php echo $filter['name']; ?></a></li>
                <?php } ?>
                <?php } ?>
                </ul>
            </div>
        </div>
    </div>
    <?php } ?>

И то же самое в файле oclayerednavigationfilter.tpl

 

Я обернул заголовок ссылкой <a href="#" id="showHideContent"><h2><?php echo $filter_group['name']; ?></h2></a>

Дописал в класс <div class="layered-content" id="content3" style="display:none;">

Сам скрипт такой:

$(document).ready(function(){

           $("#showHideContent").click(function () {
                       if ($("#content3").is(":hidden")) {

                               $("#content3").show("slow");

                       } else {

                               $("#content3").hide("slow");

                       }
 return false;
});
});

Но работает только с первым заголовком фильтра, а после выбора одного из параметров и обновления страницы и первый перестает работать, просто ссылка становится пустой ("#"). Я так понимаю, что это из-за того, что фильтры выводятся циклом, а значение присваивается только одному из них, а надо раскидать разные идентификаторы на каждый фильтр, но не могу понять, как это сделать, в js не очень разбираюсь(

 

В остальном работа фильтра устраивает, поэтому не хотелось бы только из-за этого покупать готовое решение, может быть можно как-то просто сделать.

Опенкарт 2.0.3.1, если это имеет значение.

 

Змінено 30 червня 2017 користувачем smn85