gondor: Grafik ausblenden nach abgeschlossenen AJAX-Funktionen

Hallo,

ich habe ein kleines Problem:

Ich stoße über ein onChange 2 AJAX-Funktionen an:

HTML:
<select onchange="updateSizeSelect(); updateEditionSelect();" id="thumb">...</select>

JAVASCRIPT:
function updateEditionSelect() {

new Ajax.Request(url, {

method: "post",

onSuccess: function(r){
   fertig, und dann?
  },

onFailure: function(r){
   setErrorMessage(r);
  }
 });
}

function updateEditionSelect() {

new Ajax.Request(url, {

method: "post",

onSuccess: function(r){
   fertig, und dann?
  },

onFailure: function(r){
   setErrorMessage(r);
  }
 });
}

Die Funktionen lesen Werte aus Tabellen. Da es manchmal zu unterschiedlichen Ladezeiten kommt (Datenmenge groß, DSL-Leitung lahm,
etc.) wird die Ladezeit auf meiner Seite durch ein <div>-Element deutlich gemacht, indem ich eine Grafik auf display:block setze.

Nachdem die letzte Funktion abgearbeitet ist, soll das <div>-Element wieder auf display:none gesetzt werden.

Jetzt meine Frage:

Ich möchte natürlich die Grafik nur dann ausblenden, wenn beide Funktionen abgearbeitet sind. D.h. wenn eine Funktion mit Ihrer
Bearbeitung fertig ist, die andere aber noch arbeitet, soll die Grafik solange sichtbar bleiben, bis auch diese fertig ist.

Wie kann ich also sicherstellen, dass beide Funktionen mit Ihrer Berechnung durch sind?

Ist das Problem verständlich? Oder kann man das nicht realisieren?

Danke für Antworten,
gondor(..)

  1. Wie kann ich also sicherstellen, dass beide [asynchrone] Funktionen mit Ihrer Berechnung durch sind?

    Benutze Statusvariablen, zum Beispiel einen Zähler, der bei Beginn auf 0 gesetzt und von jeder Funktion nach Beendigung um 1 erhöht wird. Ist der Zähler 2, sind beide fertig.

    1. Hi Tork.

      Benutze Statusvariablen, zum Beispiel einen Zähler, der bei Beginn auf 0 gesetzt und von jeder Funktion nach Beendigung um 1 erhöht wird. Ist der Zähler 2, sind beide fertig.

      Wie soll denn die Abfrage auf den Zähler stattfinden?

      In einer Javascript-Funktion, per while-Schleife...

      function hideImage() {
      while (STATUS_VARIABLE >= 2) {
        //GRAFIK NICHT AUSBLENDEN
      }
      //GRAFIK AUSBLENDEN
      }

      ... die ich mit in dem onChange-Event aufrufe?

      <select onchange="updateSizeSelect(); updateEditionSelect(); hideImage();" id="thumb">...</select>

      gondor(..)

      1. Benutze Statusvariablen, zum Beispiel einen Zähler, der bei Beginn auf 0 gesetzt und von jeder Funktion nach Beendigung um 1 erhöht wird. Ist der Zähler 2, sind beide fertig.

        Wie soll denn die Abfrage auf den Zähler stattfinden?

        Deine Ajax-Objekte haben doch eine onSuccess-Methode. Dort kannst Du eine globale Ich-bin-fertig-Du-kannst-ausblenden-Funktion aufrufen, die a) den Zähler erhöht und b) bei Bedarf die Anzeige ausblendet.

        Globes Vorschlag mit dem Feld, das bei Beginn gefüllt und bei Abschluss geleert wird und, sobald es ganz leer ist, zum Ausblenden führt, finde ich sogar noch eleganter, weil er leichter universell einzusetzen ist (die Prüfung lautet immer "ist leer?", nicht mehr "hat einen bestimmten, anwendungsabhängigen Wert erreicht?").

  2. n'abend,

    Wie kann ich also sicherstellen, dass beide Funktionen mit Ihrer Berechnung durch sind?

    Du willst ein Array anlegen, welches du beim Starten eines Requests mit einer ID befüllst, und beim fertigstellen des Requests diese ID wieder aus dem Array wirfst. Ist das Array leer, sind keine laufenden Requests vorhanden. Existieren Elemente im Array, sind noch Requests unterwegs.

    Ich weiß nicht, welche Toolbox du für deinen Ajax-Krempel nutzt. Bist du sicher, dass diese "Klasse" eine solche Funktionalität nicht bereits mitliefert? Beispielsweise ermöglicht  Ajax Toolbox sowas durch simples setzen einer Callback-Funktion...

    Ist das Problem verständlich? Oder kann man das nicht realisieren?

    »Your mind is your only boundary.«™

    weiterhin schönen abend...

    --
    Freundlich wie man war, hat man mir Großbuchstaben geschenkt.
    sh:( fo:# ch:# rl:| br:> n4:& ie:{ mo:} va:) de:] zu:} fl:( ss:? ls:[ js:|
    1. n'abend,

      moin moin ;-)

      Du willst ein Array anlegen, welches du beim Starten eines Requests mit einer ID befüllst, und beim fertigstellen des Requests diese ID wieder aus dem Array wirfst. Ist das Array leer, sind keine laufenden Requests vorhanden. Existieren Elemente im Array, sind noch Requests unterwegs.

      das wäre ein Lösungsansatz. Erfolgt die Abfrage per Javascript in einer while-Schleife?

      Ich weiß nicht, welche Toolbox du für deinen Ajax-Krempel nutzt. Bist du sicher, dass diese "Klasse" eine solche Funktionalität nicht bereits mitliefert? Beispielsweise ermöglicht  Ajax Toolbox sowas durch simples setzen einer Callback-Funktion...

      prototype... sollte ich mal schauen ;-)

      Danke Dir,

      gondor(..)

      1. n'abend,

        das wäre ein Lösungsansatz. Erfolgt die Abfrage per Javascript in einer while-Schleife?

        Jein. Sofern du die Informationen nicht brauchst, ist die Zähler-Variante der anderen Antwortenden definitiv zu bevorzugen.

        Eine Schleife bräuchtest du da aber nicht. An dieser Stelle war weniger ein Array, als eine HashMap/-Table/Dictionary gemeint.

        prototype... sollte ich mal schauen ;-)

        Ich nutze weder prototype  noch die Ajax Toolbox. Das war hier auch keine Empfehlung, mehr ein Hinweis.

        weiterhin schönen abend...

        --
        Freundlich wie man war, hat man mir Großbuchstaben geschenkt.
        sh:( fo:# ch:# rl:| br:> n4:& ie:{ mo:} va:) de:] zu:} fl:( ss:? ls:[ js:|
    2. Hi!

      Wozu nen Array? Eine Variable, die von jeder Funktion bei start um 1 erhoeht und bei Abschluss wieder um 1 verringert wird. dazu noch eine kleine Abfrage die die Grafik ausblendet, wenn die Statusvariable 0 enthaelt. Quasi Torks Idee hier eingebaut. Keine Schleifen, beliebig viele Funktionen werden unterstuetzt und nur eine Variable wird gebraucht.

      Das ganze kann man sogar in eine kleine Anzeige/Ausblendfunktion packen und so Code sparen.

      Son Array macht Sinn, wenn jede Funktion ne eigene ID hat, und man feststellen moechte, was hakt.

      1. n'abend,

        Wozu nen Array? Eine Variable, die von jeder Funktion bei start um 1 erhoeht und bei Abschluss wieder um 1 verringert wird. dazu noch eine kleine Abfrage die die Grafik ausblendet, wenn die Statusvariable 0 enthaelt. Quasi Torks Idee hier eingebaut. Keine Schleifen, beliebig viele Funktionen werden unterstuetzt und nur eine Variable wird gebraucht.

        Jaja... Für diese Anwendung reicht ein Zähler natürlich vollkommen aus - habe ich aber erst bedacht, als ich das Posting schon gesendet hatte. Mein eigenes Kommunikationsinterface regelt das mit IDs, da ich (ähnlich der Ajax Toolbox) verschiedene Requests gruppieren will, auf verschiedene Requests zu verschiedenen Zeitpunkten zugriff haben will (ggf um etwas durch den Monitor [nein, nicht der Bildschirm] abbrechen zu lassen, etc).

        weiterhin schönen abend...

        --
        Freundlich wie man war, hat man mir Großbuchstaben geschenkt.
        sh:( fo:# ch:# rl:| br:> n4:& ie:{ mo:} va:) de:] zu:} fl:( ss:? ls:[ js:|