Hallo,

ich setze in einem Projekt als Filter Filterizr [https://github.com/giotiskl/filterizr] ein und nun würde ich einen "verschachtelten" Filter hierbei benötigen.

Liste-1 stellt den Filter für eine Liste-2 dar.
Liste-2 soll nun für eine weitere Liste-3 als Filter dienen.

Hat soetwas schon mal jemand umgesetzt und könnte mir hier unter die Arme greifen? Beispiel(e)?

Mein aktueller Aufbau will nicht funktioneren:
Die Liste-2 hat 'data-category' plus 'data-filter' bekommen, weil ich annehme, dass das klappt

PHP-Code:
<div class="filterizrWrapperStatus col-md-3 col-12">
    <
ul class="filterizrStatus">
        <
li data-filter="all">Alle</li>
        <
li data-filter="noex">NOex</li>
        <
li data-filter="viex">VIex</li>
        <
li data-filter="blgx">BLGx</li>
        <
li data-filter="ooxx">OOxx</li>
    </
ul>
</
div>
<
div class="filterizrWrapperDistrict col-md-9 col-12">
        <
ul class="filtr-distance">
            <
li class="filtr-item" data-category="noex" data-filter="amm">AM</li>
            <
li class="filtr-item" data-category="noex" data-filter="bnn">BN</li>
            <
li class="filtr-item" data-category="blgx" data-filter="bzz">BZ</li>
            <
li class="filtr-item" data-category="ooxx" data-filter="bzz">BR</li>
        </
ul>
</
div>
<
script src="files/theme/js/vanilla.filterizr.min.js"></script>
<script>
    const filterizr = new Filterizr('.filtr-distance'); 
    filterizr.setOptions({layout: 'vertical'});
</script>




<div class="col-12 filtr-plan">
    <div class="ce_randomwrapper block">
<ul class="cols_4">
<li class="card random-item block filtr-item" data-category="amm" id="article-304">
<div class="ce_image block">
    <figure class="image_container">
        <a href="files/theme/img/nomore/herzstueck.jpg" data-lightbox="" class="cboxElement">
            <img src="files/theme/img/nomore/herzstueck.jpg" alt="" itemprop="image" width="auto" height="auto">
        </a>
    </figure>
</div>    
</li>
<li class="card random-item block filtr-item" data-category="amm" id="article-307">
<div class="ce_image block">
    <figure class="image_container">
        <a href="files/theme/img/nomore/plane.jpg" data-lightbox="" class="cboxElement">
            <img src="files/theme/img/nomore/plane.jpg" alt="" itemprop="image" width="auto" height="auto">
        </a>
    </figure>
</div>    
</li>
<li class="card random-item block filtr-item" data-category="noex" id="article-309">
<div class="ce_image block">
    <figure class="image_container">
        <a href="files/theme/img/nomore/wormy.jpg" data-lightbox="" class="cboxElement">
            <img src="files/theme/img/nomore/wormy.jpg" alt="" itemprop="image" width="auto" height="auto">
        </a>
    </figure>
</div>    
</li>
    
</ul>
</div>
</div>
<script>
    const filterizr = new Filterizr('.filtr-plan'); 
</script>