Volání javascript funkce po překreslení snippetu ajaxem

Dvory59
Člen | 40
+
0
-

Ahoj.
Mám klasický script uložený v custom.js, který se vyvolá po kliku na odpovídající classu jednotlivých článků uložených ve snippetu, ale problém je ve chvíli, když snippet pomocí ajaxu překreslím a zobrazím další články (paginator) . V té chvíli už script v custom.js nereaguje.

Nevíte někdo prosím čím je to způsobeno a jak to napravit?

Díky moc

Kamil Valenta
Člen | 822
+
+1
-

Obávám se, že informací je málo.

Co je „klasický skript“ v custom.js? Je tam funkce? Nebo tam binduješ onclick události na nějaké prvky DOMu?
Pokud to tam totiž binduješ, je jasné, že po překreslení snippetu to žádný onclick mít nebude.

Buď si tedy v custom.js napiš funkci a každý prvek ji bude volat ve svém onclicku,
nebo si nabindování onclicku vyčleň do samostatné funkce, která se zavolá i ve snippetu, tj. po jeho překreslení…

Editoval kamil_v (24. 6. 2019 11:58)

F.Vesely
Člen | 369
+
0
-

Dalsi moznosti je, ze tu udalost navesis na neco, co v kodu bude uz pri nacteni, napriklad:

<div id="list">
	{snippet items}
		<div class="item">...</div>
	{/snippet}
</div>
<script>
$("#list").on("click", ".item", function(){
...
});
</script>
Kamil Valenta
Člen | 822
+
0
-

To si právě myslím, že ne. Protože ten níže uvedený JS nabinduje onclicky na DIV.item, které jsou ve snipetu. Po jeho překreslení se ale vytvoří nové DOM prvky, které v onclicku nebudou nic mít.

Takže buď bys měl:

<div id="list">
    {snippet items}
        <div class="item" onclick="func(...)">...</div>
    {/snippet}
</div>

nebo

<div id="list">
    {snippet items}
        <div class="item">...</div>
		<script>bindClicks();</script>
    {/snippet}
</div>

<script>
function bindClicks() {
    $("#list").on("click", ".item", function(){
    ...
    });
}
</script>
F.Vesely
Člen | 369
+
0
-

Funguje to, zkus to.

Andy3
Člen | 15
+
+2
-

Ahoj, jsou dve moznosti.

  1. A to je to co psal kamil_v, a F.Vesely(jen ten script tag musi byt soucasti snippetu). Co se děje: Zobrazis nejake HTML a pak na nej navesis nejake eventy. Problem je pri Ajaxu, protoze ty to puvodni HTML zahodis(a s nim i ty eventy) a das tam nove HTML a na to je potreba opet znovu navesit eventy.
  2. Pokud jedes na jQuery. Drive se pouzival .live() v novejsim API se to dele pres .on(), ale je potreba , aby v .on() byl ve druhem parametru zanoreny css select. Napr.:
.on("click", ".container .item", ....)

s tím, že ten rodic .container se nesmi snippetou prekreslovat, pouze dite(„.item“).

Editoval Andy3 (25. 6. 2019 5:19)

Kamil Valenta
Člen | 822
+
+3
-

F.Vesely napsal(a):

Funguje to, zkus to.

Promiň, máš pravdu, nevšiml jsem si pořádně, že tu událost binduješ na #list, který se nepřekresluje.