Prototyp i samouczek AJAX

Wprowadzenie do AJAX

AJAX oznacza Asynchroniczny JavaScript i XML. AJAX to nowa technika tworzenia lepszych, szybszych i bardziej interaktywnych aplikacji internetowych za pomocą XML, HTML, CSS i Java Script.

Aby uzyskać pełne zrozumienie technologii AJAX, przejdź do naszego prostego samouczka AJAX .

Prototypowa obsługa AJAX

Prototypowy framework umożliwia obsługę wywołań Ajax w bardzo łatwy i przyjemny sposób, który jest również bezpieczny (między przeglądarkami). Prototyp w inteligentny sposób radzi sobie również z kodem JavaScript zwracanym z serwera i udostępnia klasy pomocnicze do sondowania.

Funkcjonalność Ajax jest zawarta w globalnym obiekcie Ajax . Ten obiekt zapewnia wszystkie niezbędne metody do obsługi żądań i odpowiedzi AJAX w łatwy sposób.

Żądanie AJAX

Rzeczywiste żądania są tworzone przez tworzenie instancji obiektu Ajax.Request () .

new Ajax.Request('/some_url', { method:'get' });

Pierwszym parametrem jest adres URL żądania; drugi to skrót opcji. Opcja method odnosi się do metody HTTP, która ma zostać użyta; domyślną metodą jest POST.

Wywołania zwrotne odpowiedzi AJAX

Żądania Ajax są domyślnie asynchroniczne, co oznacza, że ​​musisz mieć wywołania zwrotne, które będą obsługiwać dane z odpowiedzi. Metody wywołania zwrotnego są przekazywane w skrócie opcji podczas wysyłania żądania -

new Ajax.Request('/some_url', {
   method:'get',
   onSuccess: function(transport) {
      var response = transport.responseText || "no response text";
      alert("Success! \n\n" + response);
   },
   onFailure: function() { alert('Something went wrong...') }
});

Tutaj w hashu przekazywane są dwa wywołania zwrotne -

  • onSuccess
  • onFailure

Każde z powyższych dwóch wezwań jest wywoływane odpowiednio w zależności od statusu odpowiedzi. Pierwszym parametrem przekazywanym do obu jest natywny obiekt xmlHttpRequest, z którego można użyć odpowiednio jego właściwości responseText i responseXML .

Możesz określić oba wywołania zwrotne, jeden lub żaden - to zależy od Ciebie. Inne dostępne oddzwonienia to -

  • onUninitialized
  • onLoading
  • onLoaded
  • onInteractive
  • onComplete
  • onException

Wszystkie pasują do określonego stanu transportu xmlHttpRequest , z wyjątkiem onException, który jest uruchamiany, gdy wystąpił wyjątek podczas wysyłania innych wywołań zwrotnych.

NOTE- Wywołania zwrotne onUninitialized, onLoading, onLoaded i onInteractive nie są implementowane konsekwentnie we wszystkich przeglądarkach. Ogólnie rzecz biorąc, najlepiej ich unikać.

Prototypowe metody AJAX

Obiekt AJAX udostępnia wszystkie niezbędne metody do obsługi żądań i odpowiedzi AJAX w łatwy sposób. Oto pełna lista wszystkich metod związanych z AJAX.

NOTE - Upewnij się, że masz co najmniej wersję 1.6 pliku prototype.js.

S.No. Metoda i opis
1. Opcje Ajax

Nie jest to metoda, ale zawiera szczegółowe informacje o wszystkich podstawowych opcjach wspólnych dla wszystkich requesterów AJAX i wywołań zwrotnych.

2. Ajax.PeriodicalUpdater ()

Okresowo wykonuje żądanie AJAX i aktualizuje zawartość kontenera na podstawie tekstu odpowiedzi.

3. Ajax.Request ()

Inicjuje i przetwarza żądanie AJAX.

4. Ajax.Responders ()

Repozytorium globalnych odbiorców powiadamianych o każdym kroku żądań AJAX opartych na prototypach.

5. Ajax.Response ()

Obiekt przekazany jako pierwszy argument wszystkich żądań wywołań zwrotnych Ajax.

6. Ajax.Updater ()

Wykonuje żądanie AJAX i aktualizuje zawartość kontenera na podstawie tekstu odpowiedzi.