Jak spustit jquery po provedení akce

vanaveno
Člen | 144
+
0
-

Ahojte nevím jak vyřešit akci za pomocí javacriptu. Při vložení zboží do košíku bych chtěl, aby se po provedení akce na chvilku zobrazil seznam obsahu košíku a potom zase zmizel. Jak na to, mohli byste mi prosím poradit? Děkuji

dakur
Člen | 493
+
+1
-

@vanaveno Ahoj, ten košík musíš mít někde v DOM (tedy v HTML) a musíš zajistit, že se aktualizuje jeho obsah – např. pomocí snippetů. Po vložení zboží ho zobrazíš a za chvíli zase skryješ. Pokud to budeš řešit těma snippetama, budeš k tomu potřebovat např. naja.js a událost afterUpdate na snippet handleru. (Nebo starší nette.ajax – s tím nemám zkušenosti.) Celkově zhruba nějak takto:

{snippet kosik}
<div id="kosik">
  ...obsah...
</div>
{/snippet}
naja.snippetHandler.addEventListener('afterUpdate', (event) => { // po překreslení košíku
    const kosikEl = document.getElementById('kosik');
    kosikEl.style.display = 'block'; // zobraz
    window.setTimeout(() => kosikEl.style.display = 'none', 3000); // po 3s zase skryj
});
vanaveno
Člen | 144
+
0
-

Díky

dakur napsal(a):

@vanaveno Ahoj, ten košík musíš mít někde v DOM (tedy v HTML) a musíš zajistit, že se aktualizuje jeho obsah – např. pomocí snippetů. Po vložení zboží ho zobrazíš a za chvíli zase skryješ. Pokud to budeš řešit těma snippetama, budeš k tomu potřebovat např. naja.js a událost afterUpdate na snippet handleru. (Nebo starší nette.ajax – s tím nemám zkušenosti.) Celkově zhruba nějak takto:

{snippet kosik}
<div id="kosik">
  ...obsah...
</div>
{/snippet}
naja.snippetHandler.addEventListener('afterUpdate', (event) => { // po překreslení košíku
    const kosikEl = document.getElementById('kosik');
    kosikEl.style.display = 'block'; // zobraz
    window.setTimeout(() => kosikEl.style.display = 'none', 3000); // po 3s zase skryj
});
jiri.pudil
Nette Blogger | 1028
+
+1
-

Pokud používáš Naju, tak pozor, událost afterUpdate se volá pro každý překreslený snippet. Pokud bys jich překresloval víc najednou, vykoná se ti i kód listeneru víckrát. Ideálně bys měl ten kód zavolat jen tehdy, když se překreslí snippet s košíkem:

naja.snippetHandler.addEventListener('afterUpdate', (event) => {
    const kosikEl = event.detail.snippet.querySelector('#kosik');
    if (kosikEl !== null) { // po překreslení košíku
        kosikEl.style.display = 'block'; // zobraz
        window.setTimeout(() => kosikEl.style.display = 'none', 3000); // po 3s zase skryj
    }
});