Hallo ZP-Support
Ich implementiere ein eigenes Filter-Widget (Rebsorten-Dropdown und Textsuche).
Obwohl alle Artikel auf einer Seite geladen sind und im Browser-Inspektor die Klasse .zpshoparticle (bzw. .zpShopItem) eindeutig zugewiesen ist, hat externes JavaScript keinen Zugriff darauf. document.querySelectorAll('.zpshoparticle').length liefert konsequent den Wert 0
Ich füge dieser Anfrage einen Screenshot meines Quellcodes bei. Man sieht dort deutlich:
- Die aktive Version 17.0.4.0.
- Dass die Artikel die Klassen tragen, die ich ansprechen möchte.
- Dass der Code auf der Seite artikeldetail.php generiert wird.
Meine bisherige Versuche:
- Zugriff via DOMContentLoaded mit setTimeout (bis zu 3 Sekunden).
- Einsatz eines MutationObserver, um auf das Rendern der Shop-Inhalte zu warten.
Beide Methoden "sehen" die Artikel-Elemente nicht.
Fragen an den Support:
1. Warum sind die Shop-Elemente für JavaScript unsichtbar? Werden diese in einem Shadow-DOM oder einem IFrame gekapselt, der den Zugriff von einem Quelltext-Widget aus verhindert?
2. Gibt es einen spezifischen Container-Selektor? Muss ich anstelle von document ein spezielles Objekt oder eine ID (z. B. #zpShopContainer) ansprechen?
3. Internes Event: Gibt es ein Zeta-internes JavaScript-Event (z. B. onShopRendered), das ich abgreifen kann, um meine Filter-Logik zu triggern?
Hier ist das verwendete Skript:
function applyFilter() {
var items = document.querySelectorAll('.zpshoparticle');
console.log("Gefundene Artikel: " + items.length); // Liefert immer 0
}
Softwareversion und Layout:
ZP-Version: 17.0.4.0
Layout: Bella Responsive
Anzahl Artikel auf die Seite:
Ich habe bewusst unter Shop/Einstellungen/Layout/Artikel-Listen: Produkte pro Seite der Wert von 48 auf 100 geändert, sodass alle Artikel gleichzeitig (ich habe nicht mehr als 100 Arteil) im DOM geladen werden.
Vielen Dank für eure Unterstützung.
Giuseppe