Prototype JS: AJAX Request abbrechen

[Mario Steinko]

Hallo!

Ich hab eine Prototype JS Formular Observer function, die jedesmal wenn sich der Formularwert ändert einen AJAX Request absendet und das Ergebnis unterhalb des Formulars anzeigt.
Nun zu meinem Problem: Wenn ein User den Inhalt absendet, wird ein AJAX Request gemacht - wie es sein soll. Wenn der User vor beendigung dieses Requests aber was ändert wird kein neuer gestartet, sondern der alte läuft weiter.
Gibts eine Möglichkeit zu überprüfen ob ein AJAX Request bereits läuft und falls es so is ihn abzubrechen?

danke
Mario

[molily]

Gibts eine Möglichkeit zu überprüfen ob ein AJAX Request bereits läuft und falls es so is ihn abzubrechen?

Ajax.Request bietet meines Wissens keine Funktion zum Abbrechen, aber man kann natürlich auf das dahinterliegende XMLHttpRequest-Objekt zugreifen und dessen abort-Methode aufrufen:

var request = new Ajax.Request(...);
...
request.transport.abort();

Allerdings weiß ich nicht, ob das zuverlässig verhindert, dass der onSuccess-Handler usw. aufgerufen wird. Ich würde daher einen anderen Ansatz wählen, nämlich in der onSuccess-Funktion prüfen, ob die Antwort sich auf den letzten Request bezieht. Z.B. speicherst du das zuletzt angelegte Ajax.Request-Objekt einmal zentral und einmal in einer lokalen Variable. In onComplete prüfst du dann, ob beide noch identisch sind. Wenn nicht, tue nichts, weil schon ein weiterer Request auf dem Weg ist.

var lastRequest;  
new Form.Observer('feld', 0.5, function (form, value) {  
  var request;  
  request = lastRequest = Ajax.Request(url, {  
    onSuccess: function (transport) {  
      if (request == lastRequest) {  
        /* ... Nutzlast ... */  
      }  
    }  
  });  
});

Mathias

[Mario Steinko]

Hi!

Sry, ich hab mirs grad nochmal angesehn und meine Beschreibung stimmte ncith ganz...

1. 1. mal Formular inhalt geändert -> Request abgesetzt & Element.show('loading'); ausgeführt
2. 2. mal Formular inhalt geändert -> Request abgesetzt & Element.show('loading'); nochmal ausgeführt
3. 1. Request wird beendet, Wert in div gespeichert & Element.hide('loading'); ausgeführt
      // Hier liegt jetzt der Fehler, es wird zwar noch nicht das neuste Ergebnis gespeichert, die lade-Anzeige aber beendet
      4)  2. Request wird beendet, richtige Wert in div gespeichert & Element.hide('loading'); erneut ausgeführt
      jetzt stimmt alles wieder

Gibts ne Möglichkeit nach 3) noch immer das lade-Symbol anzuzeigen?

lg
Mario

[molily]

Gibts ne Möglichkeit nach 3) noch immer das lade-Symbol anzuzeigen?

Ja, die habe ich dir schon gesagt.

Wenn du willst, dass die Serverantwort ins div geschrieben wird, aber die Ladeanimation weiter bleibt, wenn noch ein weiterer Request läuft, dann platzierst du das Ausblenden der Ladeanimation in der beschriebenen Abfrage, ob der gerade beantwortete Request der letzte Request ist.

Mathias

[Jurik]

Du könntest das ganze auch mit Queues machen. Da schiebst du hinter das Absenden des Formulares das Ausblenden der Ladeanimation rein. Falls nun noch ein weiterer Request kommt, löscht du das Ausblenden der Ladeanimation aus der Queue und schreibst sie erneut hinter die letzte Request.

Oder noch besser - 2 scopes. In das erste (START) schreibst du deine Requests und in das zweite (END) schreibst du dein "Ausblenden der Ladeanimation". Wenn ein weiterer Request gesendet wird, kommt der in die Start Queue und somit wird erst das Ladeanimationsding ausgeblendet wenn nix mehr in der Startqueue ist.

Falls du das so umgesetzt hast, kannste ja mal den Code hier posten - würde mich interessieren ;)

[Mario Steinko]

sry, stimmt.
Hab ich damals wohl ned gecheckt :-/