Events nach Ajax Load neu initialisieren

[KasselJulian]

Hi,

nach einem Ajax-Load werden Events ja nicht auf die Elemente übernommen die neu geladen werden. Sprich wenn ich in einer JS-Datei Events für meine Seite erstelle, diese Seite dann aber mittels Ajax austausche, sprechen die Events nicht bei meinem mit Ajax geladenen Content an. Sie müssen neu aufgerufen werden damit sie neu auf den Seiteninhalt bezogen sind.
Das ganze kann man so machen, dass man alle jQuery-Events in eine JavaScript-Funktion packt, diese nach dem Ajax-Load aufruft und damit löst, dass die Events nicht auf die neu geladenen Elemente zugewiesen sind.
Finde ich aber nicht sehr schön.
Gibts da noch ne andere Möglichkeit die Events nach Ajax-Load neu zu initialisieren?

 

[Duddle]

AW: Events nach Ajax Load neu initialisieren

Früher ging das mit .live(), das ist jetzt aber deprecated. Im Handbuch zu .live() steht, wie du es in neueren Versionen machen kannst.


Duddle

 

[KasselJulian]

AW: Events nach Ajax Load neu initialisieren

Deiner Ansicht nach sollte

$("p").on("click", function(){

alert( $(this).text() );

});

funktionieren. Richtig? Kann es momentan nicht testen, aber später.

 

[Duddle]

AW: Events nach Ajax Load neu initialisieren

Nein, meiner Ansicht nach sollte das funktionieren, was im Handbuch beschrieben wird.


Duddle

 

[KasselJulian]

AW: Events nach Ajax Load neu initialisieren

Das war jetzt nicht sehr hilfreich, weil genau das dort beschrieben wird
.on() ist der Ersatz für .live()

 

[KasselJulian]

AW: Events nach Ajax Load neu initialisieren

Wie ist das aber eigentlich wenn ich ein Plugin initialisiere?

    $('.example').plugin({
        param:false
    });

Wie könnte ich das auch dem mit Ajax geladenen Conten zuweisen? Es ist ja kein click, hover etc. Event deswegen kann man da doch .on() garnicht anwenden, oder?

Und wie sieht es aus wenn ich mehreren Elementen ein Event dynamisch zuweise:

    $(document).on("click", $(this), function(){
      alert("1");
    });

 

[KasselJulian]

AW: Events nach Ajax Load neu initialisieren

... no one?
That´s a pity

 

[Myhar]

AW: Events nach Ajax Load neu initialisieren

Ein Dreifachpost, hurra
Du musst es einfach den neuen Elementen auch zuweisen. Dabei ist zu achten, dass du es den bestehenden Elementen nicht doppelt zuweist. In manchen Situationen vielleicht egal, aber ich hatte auch schon Situationen, wo das Ergebnis war, dass ein Toggle Ereignis dann zB zweimal aufgerufen wurde.

 

[KasselJulian]

AW: Events nach Ajax Load neu initialisieren

So ist das nunmal wenn keiner Antwort weiß.
Das ist mir schon klar und das habe ich auch in meinen Posts geschrieben, die Frage ist wie: praktisch!
Ich möchte nicht eine Funktion schreiben und diese dann nach Ajax Load immer neu aufrufen um die neuen Events zu initialisieren, da gibt es garantiert eine schönere Methode, sowas wie on()

 

[Myhar]

AW: Events nach Ajax Load neu initialisieren

Das musst du aber selber herausfinden. Entweder in deinem Plugin ist ein Weg beschrieben, wie sich das Plugin auch auf zukünftige Elemente initialisieren lässt oder du musst die Funktion jedesmal neu aufrufen. Alternativ kannst du das Plugin natürlich auch umschreiben, so dass der von dir gewünschte Effekt auftritt. Im Plugin wird sicher mit .on() gearbeitet, da kannst du eventuell den Teil so umschreiben, dass es sich wie gewünscht verhält.

 

[mindraper]

AW: Events nach Ajax Load neu initialisieren

moin,

jungs, da benutzt ihr schon ein framework und kennt euch nicht weiter damit aus, als dass ihr ein plugin einbinden könnt.

http://api.jquery.com/delegate/

lg

 

[Duddle]

AW: Events nach Ajax Load neu initialisieren

... welches veraltet ist.

As of jQuery 1.7, .delegate() has been superseded by the .on() method.

Duddle

 

[mindraper]

AW: Events nach Ajax Load neu initialisieren

moin,

... welches veraltet ist.

shit. mein fehler. ich schätze das passiert, wenn man jQuery so gut wie nie benutzt.

 

[KasselJulian]

AW: Events nach Ajax Load neu initialisieren

Wisst ihr die Lösung wäre etwas in der Art:

$(document).on("load", ".element", plugin({
  option: value
}));

Das funktioniert ja nicht, aber in der Richtung würde ich auf document ready alle Elemente (und die in der Zukunft) mit dem Plugin "plugin" initialisieren.

 

[Duddle]

AW: Events nach Ajax Load neu initialisieren

Der letzte Parameter von .on() muss eine Funktion sein, kein Funktionsaufruf (ausser der Funktionsaufruf gibt eine Funktion zurück).
Wenn ich dir eine Anleitung zum Backen eines Kuchens gebe ist es was anderes als wenn ich den Kuchen backe und ihn dir gebe.


Duddle

 

[KasselJulian]

AW: Events nach Ajax Load neu initialisieren

Mir leuchtet das auch ein. Es geht ja auch nicht darum dass ich sage dass das da oben korrekt ist, es geht darum zu sagen wie es in etwa aussehen könnte.

// Edit:
Aber ich merke es führt zu nichts. Es wird keine Alternativlösung geben außer die Plugins nach Ajax load erneut zu initialisieren. Doch sehe ich dort ein Problem:
Ich müsste die Plugins nur auf Elementen initialisieren, die das Plugin nicht bereits zugewiesen bekommen habe. Wenn jetzt also $(element).plugin() nach dem Ajax load schreibe, dann würde sich das ja auch auf die Elemente beziehen die bereits vor dem Ajax load schon eine Initialisierung erhalten haben.
Gibt es eine Möglichkeit das auszuschließen und die Initialisierung nur an Elemente zu verweisen die diese nicht bereits erhalten haben? (Das sollte auch bei Plugins funktionieren die kein "click", "hover" etc. Event haben, sondern auf "load" anspringen)

 

[mindraper]

AW: Events nach Ajax Load neu initialisieren

moin,

[...] Es geht ja auch nicht darum dass ich sage dass das da oben korrekt ist, es geht darum zu sagen wie es in etwa aussehen könnte.

das ist bereits mehrfach geschehen. hier eine step-by-step übersicht was insgesamt zu tun ist:

1. seite laden
2. plugins initialisieren/starten
3. bei "click" auf was-auch-immer einen ajax-request absenden
4. warten bis der request zurück kommt
5. einen teilbereich der seite mit dem zurück gekommenen request bzw. dessen daten befüllen
6. im teilbereich benötigte plugins neu starten

Aber ich merke es führt zu nichts. Es wird keine Alternativlösung geben außer die Plugins nach Ajax load erneut zu initialisieren.

korrekt.

Doch sehe ich dort ein Problem:
Ich müsste die Plugins nur auf Elementen initialisieren, die das Plugin nicht bereits zugewiesen bekommen habe. Wenn jetzt also $(element).plugin() nach dem Ajax load schreibe, dann würde sich das ja auch auf die Elemente beziehen die bereits vor dem Ajax load schon eine Initialisierung erhalten haben.

falsch. die elemente wären ja nicht mehr vorhanden. es sei denn, die plugins werden auch auf elementen initialisiert, die nicht ausgetauscht werden. in dem fall einfach die elemente auswählen, die im neu geladenen teilbereich enthalten sind und auf diesen die plugins initialisieren.

Gibt es eine Möglichkeit das auszuschließen und die Initialisierung nur an Elemente zu verweisen die diese nicht bereits erhalten haben?

siehe oben.