Wie Sie beschäftigt Symbole in einer AJAX-Website umgehen?

Question

Wie Sie beschäftigt Symbole in einer AJAX-Website umgehen?

stimmen

2

Diese Frage beschäftigt sich mit Concurrency Probleme, Anregungen, wie ein arbeitsreiches Symbol angezeigt werden, diese Frage sehen: Javascript - Laden / Besetztanzeige oder transparent div über Seite auf Ereignis klicken

Wenn ein Benutzer eine AJAX-Anforderung auf einer Seite initiiert ist es sinnvoll, eine Art von „Arbeiten“ oder beschäftigt Symbol oder Fortschrittsanzeige zu zeigen. Wenn es nur eine lang andauernde Prozess kann dies in einer relativ einfachen Art und Weise behandelt werden:

function do_action() {
   show_busy_icon();       

   long_running_asynchronous_process(function() {
      // Callback function run when process finishes
      hide_busy_icon();
   });
}

Wenn jedoch mehrere asynchrone Prozesse auf der Seite ausgeführt werden, unter Verwendung von Ein / Aus-Methoden nicht funktionieren würde. Der erste Prozess schaltet zu beenden das Symbol, obwohl es laufen weitere Prozesse.

Also, wie gehen Sie einen Indikatoren anzeigt, auf einer Web - Seite, dass auf ist , wenn es ein oder mehr Prozesse ausgeführt wird , und ausgeschaltet , wenn es läuft keine Prozesse?

Ich stelle mir vor , es wäre möglich , läuft eine Zählung der Anzahl der Prozesse zu erhalten. hide_busy_icon()nur versteckt das Symbol , wenn die Prozessanzahl ist 0. Die irgendwie anfällig für Fehler scheint. Vielleicht gibt es eine bessere / einfachere Art und Weise , die ich nicht sehen.

Vielen Dank für Ihre Ideen und Anregungen!

Edit: Nach dem mit der Lösung in der markierten Antwort für eine Weile arbeiten, ich bin froh, dass es sehr gut zu sagen, funktioniert. Das einzige Problem, das ich habe laufen in sind Fälle, in denen meine eigene Skripte Funktionen von Skripten aufrufen ich nicht kontrollieren. Es sei denn, diese Funktionen Rückrufe ermöglichen geliefert werden, es gibt keine Möglichkeit, den Prozess Zählung zu aktualisieren, wenn sie beginnen und enden.

Ein Beispiel, wo dies kann auftritt, ist eine Reihe von Markierungen auf eine Google-Karte hinzufügen. Sobald mein Skript ruft funktioniert die Google Maps das Besetzt-Symbol verschwindet, während die Markierungen noch geladen werden.

Ich bin nicht sicher, eine gute Möglichkeit, dies zu umgehen.

javascript jquery ajax concurrency callback

Veröffentlicht am 09/12/2008 um 19:28
quelle vom benutzer GloryFish

In anderen Sprachen...

6 antworten

stimmen

0

Bitte lesen Sie meine Antwort hier:

Wie ein Ladebildschirm während Inhalte Lasten anzuzeigen

Ich gebe ein kleines, Arbeits JavaScript Beispiel dafür, wie genau das zu tun, hoffe, es hilft.

Beantwortet am 09/12/2008 um 19:40
quelle vom benutzer mmattax

stimmen

1

Ich denke, das Problem ist wirklich, dass Sie nur ein Indikator verwenden. Es kann einfacher sein, für jede Aktion einen Indikator zu haben, die man braucht.

Also, wenn Sie auf einer Seite jeden Bereich Suche mehr Such haben würde seine eigene unabhängige Anzeige, die in den entsprechenden JavaScript-Funktionen ein- oder ausgeblendet wird.

Beantwortet am 09/12/2008 um 19:40
quelle vom benutzer Colin Biggs

stimmen

1

Prototype hat diese eingebaut; genannt eine Eigenschaft Ajax.activeRequestCountverfolgt, wie viele Anfragen zu einem bestimmten Zeitpunkt aktiv sind. Es wird auch Sie global Ajax - Responder einrichten , um zu bestimmen , ob das „Besetzt“ Symbol verstecken oder zu zeigen.

Beantwortet am 09/12/2008 um 21:34
quelle vom benutzer savetheclocktower

stimmen

0

Ich schlage vor, eine andere Lösung. dies wird Code nicht getestet, wird wahrscheinlich nicht funktionieren, sondern eine Darstellung des Konzepts.

Ich gehe davon aus der gleichen excact Aktion in mehreren Fällen nicht ausgeführt werden. Ich tue dies, um sicherzustellen, dass Timeouts oder ähnliche Probleme in der Kommunikation nicht das Kennzeichen nicht hängen, sondern ermöglicht die Anzeige gelöst werden, wenn die Kommunikation wieder hergestellt

 var actionRegister = new Array();

 function register_action(actionId)
 {
     show_busy_icon();       
     if(blockedTile.indexOf(actionId) != -1)
     {  // element already registered
        return;
     }
     actionRegister.push(actionId)
}


function unregister_action(actionId)
{
    var idx = blockedTile.indexOf(actionId);
    if(idx  != -1)
    {  
        actionRegister.splice(idx,1);
    }

    if(actionRegister.length < 1)
    {
       hide_busy_icon();
    }
}

Beantwortet am 18/04/2012 um 10:03
quelle vom benutzer Henrik

stimmen

0

Wir suchen alle es der falsche Weg. Ajax Anrufe werden verwendet, um die XHR zu laden Inhalt verwenden. Das heißt, es hat einige vordefinierte Elemente im gesamten DOM sein, wo der Inhalt geladen wird. sagen wir eine HTML dieser Art haben:

<html>
<body>
   <div id="content_1">
   </div>
   <div id="content_2">
   </div>
</body>
</html>

Mit jQuery, sagen wir in content_1 und content_2 von content_1.php und content_2.php laden möchten sind.

Verwenden Sie das folgende Skript, um die Ajax zu behandeln ::

$("content_1").html("<img src='loading.gif'>").load("http://samplesite.com/content_1.php");

$("content_2").html("<img src='loading.gif'>").load("http://samplesite.com/content_2.php");

Dies wird eine Lade gif in den jeweiligen divs platzieren und die gif wird später durch den geladenen Inhalt aus dem PHP ersetzt werden. Einfach eine Zeile Skript. Kein Zähler erforderlich.

Voraussetzung: jede neueste Version von jQuery.

Beantwortet am 31/12/2012 um 10:18
quelle vom benutzer Rohan Bagchi

Illandril · Accepted Answer · 2008-12-09 19:47

stimmen

8

Der Autor der Frage hat diese Antwort als die beste genommen.

Wenn Sie die gleiche Besetztanzeige für alle Aktionen wollen, dann verwenden Sie einen Zähler.

Statt "show_busy_icon ()", machen einen "increment_busy_count ()", die "show_busy_icon ()" bei Besetzt Zählung von 0 auf 1. Statt "hide_busy_icon ()" nennt, machen einen "decrement_busy_count ()", welche Anrufe „hide_busy_icon ()“ bei besetzt Zahl von 1 auf 0 geht.

Beantwortet am 09/12/2008 um 19:47
quelle vom benutzer Illandril