JetEngine - dynamic tables builder

A Dynamic Tables Builder akkor jön jól, amikor adatlistát kell megmutatnod, de elakadsz a „hogyan legyen ebből átlátható, szűrhető, rendezhető táblázat?” ponton. Nem statikus HTML-táblát kapsz, hanem olyan dinamikus nézetet, ami Querykre épül, több szerkesztőben használható, és később is karbantartható marad. Ha eddig egyedi lekérdezésekkel, shortcode-okkal vagy félmegoldásokkal szenvedtél, ez leveszi a terhet.

Hogyan gondolkodj róla, hogy ne fuss zsákutcába?

Itt is igaz: előbb adat, aztán megjelenítés. A tábla nem „kitalálja” az adatot, hanem megjeleníti azt, amit a Query ad. Ha bármi furcsán viselkedik, mindig a Query felé menj vissza ellenőrizni. A táblalayout stabil, az adatelőkészítés a kritikus pont.

A működés röviden így áll össze:
készítesz egy Queryt → Tables Builderben kiválasztod → Fetch-el betöltöd az oszlopokat → oszloponként eldöntöd, mit és hogyan mutatsz → kirakod a Dynamic Table elemmel.

Hiba: üres tábla jelenik meg

Ez a leggyakoribb elakadás. Ilyenkor általában nem a tábla rossz, hanem az adat nem érkezik meg. Ellenőrizd, hogy a Query Preview tényleg hoz-e sorokat. Ha ott sincs adat, a táblában sem lesz. Ha van adat, de mégis üres, futtasd újra a Fetch/Re-fetch műveletet, mert az oszloplista még a régi lekérdezéshez kötődik.

Hiba: oszlopok vannak, de „nem az látszik, amit vársz”

Ez jellemzően kimenet-probléma. Alapértelmezetten Raw value jelenik meg, ami sokszor nem felhasználóbarát. Dátum, ár, státusz esetén válts Callback/formatting módra. Ha komplex tartalmat szeretnél (kép, gomb, értékelés, lejátszó), használj Template kimenetet Listing sablonnal. Ha ezt kihagyod, a tábla technikailag jó lesz, UX-ben viszont gyenge.

Hiba: szűrés nem működik vagy „nem ezt a táblát szűri”

JetSmartFilters esetén a leggyakoribb gond a provider eltévesztése. A szűrő Providerének JetEngine Dynamic Table-nek kell lennie. Több tábla esetén ellenőrizd a Query ID-kat is, mert különben a szűrő egy másik lekérdezést próbál módosítani. Ha látszólag reagál, de nem frissül, kapcsold be az AJAX-ot a szűrőknél.

Hiba: rendezés furán viselkedik

A rendezés az adat típusa szerint működik. Ha számként szeretnél rendezni, de szövegként érkezik az érték (pl. ár), akkor látszólag „összekeveri” a sorrendet. Ilyenkor a Queryben vagy a kimeneti callbacknél kell gondoskodnod a helyes adattípusról. A táblában ez már nem javítható visszamenőleg.

Nagy adatmennyiség miatti lassulás

Ha sok sorod van, a megoldás nem a dizájn egyszerűsítése, hanem a pagináció használata. Ne próbálj több száz sort egyben kirakni. SQL vagy REST API esetén különösen fontos a lapozás és a cache használata. Sok oszlopnál kapcsold be a horizontális scrollt, mert ez nem csak UX-, hanem teljesítménykérdés is.

Újrafelhasználás, amikor „nem akarsz még egy táblát”

Ha ugyanazt a kinézetet több adatforrásra szeretnéd használni, a Rewrite table query a megoldás. Így nem kell új táblát építened, csak lecseréled alatta a Queryt. Ez különösen hasznos ügynökségi projekteknél vagy több archív nézetnél.

Mikor nem ez az ideális eszköz?

Ha egyszerű, statikus táblázatot akarsz, vagy nincs szükség szűrésre, rendezésre, akkor túlzás lehet. Akkor is érdemes mást választani, ha pixelpontos, Excel-szerű táblakezelésre van szükséged inline szerkesztéssel. A Dynamic Tables Builder megjelenítésre és böngészésre optimalizált.

Gyors hibamegoldó ellenőrzőlista

A Query visszaad adatot
Fetch után friss oszloplista látszik
Az oszlopok megfelelő kimeneti típust használnak
A szűrők Providerje helyesen van beállítva
Van pagináció nagy adatmennyiségnél
Frontenden is kipróbáltad, nem csak editorban

Ha ezek rendben vannak, a Dynamic Tables Builder stabilan fog működni. Ha szeretnéd, a következő lépésben végigmegyünk egy konkrét eseten, például „miért nem szűr az SQL-alapú tábla” vagy „hogyan rakjak gombot minden cellába Template kimenettel”.