# Szűrők a táblázatban

> Kereső, kiválasztó és tartományszűrő, aktív szűrőcímkék és szűrőtörlő gomb a dinamikus táblázat fölé a JetSmartFilters elemeivel.

A táblázat tartalmát a JetSmartFilters szűrőivel szűkítheted: a látogató beírhat keresőszót, kiválaszthat egy értéket, majd a táblázat a találatokat mutatja. Itt Elementorral építjük fel az elemeket, a menete minden szűrőnél ugyanaz: előbb létrehozod a szűrőt az **Intelligens szűrők** menüben, aztán betöltöd az oldalra a megfelelő elemet, és a **JetEngine Dynamic Table** szolgáltatóhoz kapcsolod.

## Mire lesz szükséged

- Elementor, aktív **JetEngine** és **JetSmartFilters**.
- Egy táblázat az oldalon, a lekérdezéséhez megadott **Egyéni lekérdezés-ID**-val, és a **Dynamic Table** elem **CSS ID** mezőjében ugyanazzal az azonosítóval (a [Lapozás a táblázatban](https://hub.hellowp.io/hu/plugins/jet-engine-dynamic-tables-module/lapozas-szuro-lapozas/) fejezet leírja). Az alábbi példákban ez `table-pagination`.

## Kereső szűrő

1. Nyisd meg az **Intelligens szűrők → Új hozzáadása** oldalt.
2. Add meg a **Szűrő neve** mezőben a nevet (például „Könyv keresése”).
3. A **Szűrő típusa** közül válaszd a **Keresés** csempét.
4. A **Keresés módja** listából válassz: **Alapértelmezett WordPress-keresés**, vagy **Egyéni mező szerint (lekérdezési változóból)**, ha a lekérdezésben megadott mezőben akarsz keresni.
5. A **Helykitöltő** mező a beviteli mezőben látszó, halvány szöveg.
6. A **Szűrőcímkék** részben megadható a **Szűrőcímke** és az **Aktív szűrőcímke**.
7. Kattints a közzétételre (angolul **Publish**, mentés után **Update**).

![A Keresés típusú szűrő beállításai](./kepek/lapozas-szuro-kereso-szuro-beallitas.webp)

*A Keresés típusú szűrő beállításai* (https://minta-bolt.hu/wp-admin/admin.php?page=jet-smart-filters)

Ezután az oldalon add hozzá a **Szűrő keresése** elemet (a keresőben a „Keresés” szóval megtalálod), és állítsd be a **Tartalom** fülön:

| Beállítás | Mit csinál |
|---|---|
| **Szűrő kiválasztása** | A most létrehozott szűrő. |
| **Ez a szűrő ehhez** | A szolgáltató: itt a **JetEngine Dynamic Table**. Enélkül a szűrő nem hat a táblázatra. |
| **Alkalmazás típusa** | **AJAX**, **AJAX gépelés közben**, **Oldal újratöltése** vagy **Vegyes**. |
| **Keresőgomb szövege** | A gomb felirata. |
| **Keresőgomb ikonja** | Ikon a gombon. |
| **Alkalmaz gomb elrejtése** | Elrejti a gombot. |
| **Szűrőcímke megjelenítése** | A szűrő címkéjét mutatja vagy elrejti. |
| **Lekérdezés ID** | Az egyedi azonosító, itt `table-pagination`. |
| **További szolgáltatók engedélyezése** | Egy szűrő több elemet is vezérelhet. |

![A kereső elem Tartalom füle az Elementor szerkesztőjében](./kepek/lapozas-szuro-elementor-kereso.webp)

*A kereső elem Tartalom füle az Elementor szerkesztőjében* (https://minta-bolt.hu/wp-admin/post.php?post=17&action=elementor)

A **Stílus** és a **Haladó** fülön a megjelenést állíthatod.

Az oldalon a látogató beírja a szót, és a táblázat csak a találatokat mutatja:

![A „folyó” szóra szűrt táblázat az aktív szűrőcímkével](./kepek/lapozas-szuro-oldal-kereses.webp)

*A „folyó” szóra szűrt táblázat az aktív szűrőcímkével* (https://minta-bolt.hu/konyvek-lapozas-szuro/)

## Kiválasztó szűrő

A **Kiválasztás** típusú szűrő legördülő listából választható értéket ad.

1. Az **Új hozzáadása** oldalon adj nevet, és válaszd a **Kiválasztás** típust.
2. A **Hierarchikus** kapcsolóval többszintű szűrőt kérhetsz; ha kikapcsolod, jönnek a további mezők.
3. Az **Adatforrás** lehet **Taxonómiák**, **Kézi bevitel**, **Bejegyzések**, **Egyéni mezők**, **JetEngine-szójegyzék**, **JetEngine Query Builder** vagy **JetEngine Query Builder kapcsoló**.
4. Taxonómiánál van **Üres kifejezések megjelenítése** és **Csak az aktuális kifejezés gyerekeinek megjelenítése** (a WooCommerce-es példában a termékek színe attribútumból jött). Beállítható új **Helykitöltő**, a választható elemek kizárása vagy kiválasztása, és jelölőnégyzetes metamezőnél az erre vonatkozó kapcsoló.
5. Metamezőn alapuló szűrőnél a **Lekérdezési változó** mezőbe a mező kulcsa kell. Itt ez a `konyv-szerzo`; az **Összehasonlító operátor** alapértéke **Egyenlő (=)**.

![A Kiválasztás típusú szűrő beállításai kézi bevitellel](./kepek/lapozas-szuro-select-szuro-beallitas.webp)

*A Kiválasztás típusú szűrő beállításai kézi bevitellel* (https://minta-bolt.hu/wp-admin/admin.php?page=jet-smart-filters)

Az oldalon a **Szűrő kiválasztása** elemet használd. A **Tartalom** fül itt is a szűrő, a **Ez a szűrő ehhez** (**JetEngine Dynamic Table**), az **Alkalmazás típusa** (**AJAX**, **Oldal újratöltése**, **Vegyes**) és a **Lekérdezés ID** beállításait adja. Van **Alkalmazás ekkor** választó (érték változásakor vagy az alkalmaz gomb kattintására), és külön kapcsoló az alkalmaz gombhoz és a szűrőcímkéhez.

![A szerző szerint szűrt táblázat](./kepek/lapozas-szuro-oldal-szerzo.webp)

*A szerző szerint szűrt táblázat* (https://minta-bolt.hu/konyvek-lapozas-szuro/)

## Tartományszűrő

Ugyanígy működik a **Tartomány** típusú szűrő: az **Új hozzáadása** oldalon a **Szűrő típusa** legyen **Tartomány**, add meg a szűrőcímkéket és a számértékeket adó mezőt (például árat). Az oldalon a tartományszűrő elemet válaszd, a szűrőt, a **JetEngine Dynamic Table** szolgáltatót és a **Lekérdezés ID**-t állítsd be úgy, mint a kiválasztó szűrőnél. A többi beállítás a **Stílus** fülön finomítható.

## Aktív szűrőcímkék

Az **Aktív szűrőcímkék** elem kiírja az éppen érvényes szűrőket, és a látogató egyenként törölheti őket anélkül, hogy a többit el kellene dobnia. Az oldalon legalább egy szűrőnek lennie kell, hogy az elem megjelenjen.

- Válaszd ki a táblázat szolgáltatóját (**JetEngine Dynamic Table**) és az alkalmazás típusát (**AJAX** vagy **Oldal újratöltése**).
- A **Lekérdezés ID** a szokásos azonosító.
- Ha bekapcsolod a törlés elemet, megadhatod a fő címkét és a törlés elem címkéjét (a példában „Aktív szűrők” és „Törlés”).
- Kapcsolható a további szolgáltatók engedélyezése.

A fenti, kereséssel szűrt képen jól látszik az „Aktív szűrők” sor: a „Keresés: folyó” címkén lévő jellel csak ezt a szűrőt törlöd.

## Szűrők törlése gomb

A **Szűrők törlése** elem egy gomb, amely egyszerre eltávolítja az összes érvényes szűrőt. A **Tartalom** fülön a szolgáltató legyen **JetEngine Dynamic Table**, az alkalmazás típusa és a **Lekérdezés ID** a szokásos, a gomb szövegét te adod meg (itt „Szűrők törlése”). A többi beállítás tetszés szerint.

## Lapozás a szűrők mellett

A lapozó elem ugyanígy illeszkedik a szűrők mellé, a [Lapozás a táblázatban](https://hub.hellowp.io/hu/plugins/jet-engine-dynamic-tables-module/lapozas-szuro-lapozas/) fejezet szerint. A szűrők a lapozót is újrarajzolják: ha a keresés után kevesebb találat marad, kevesebb oldalszám jelenik meg.

## Szolgáltató és azonosító

Minden szűrő és kiegészítő elem három dolog alapján kapcsolódik a táblázathoz:

1. A **szolgáltató** a **JetEngine Dynamic Table**.
2. A **Lekérdezés ID** megegyezik a lekérdezés **Egyéni lekérdezés-ID**-jával.
3. A táblázat elem **CSS ID** mezője ugyanezt az értéket tartalmazza.

Ha bármelyik hiányzik vagy eltér, a szűrő nem hat a táblázatra.