プロトタイプとAJAXチュートリアル
AJAXの紹介
AJAXは A同期 JavaScriptと XML。AJAXは、XML、HTML、CSS、およびJavaスクリプトを使用して、より優れた、より高速で、よりインタラクティブなWebアプリケーションを作成するための新しい手法です。
AJAXの完全な理解については、簡単なAJAXチュートリアルをご覧ください。
AJAXのプロトタイプサポート
プロトタイプフレームワークを使用すると、Ajax呼び出しを非常に簡単で楽しい方法で処理でき、安全でもあります(クロスブラウザー)。Prototypeは、サーバーから返されたJavaScriptコードをスマートに処理し、ポーリング用のヘルパークラスを提供します。
Ajax機能はグローバルAjaxオブジェクトに含まれています。このオブジェクトは、AJAXリクエストとレスポンスを簡単な方法で処理するために必要なすべてのメソッドを提供します。
AJAXリクエスト
実際のリクエストは、Ajax.Request()オブジェクトのインスタンスを作成することによって行われます。
new Ajax.Request('/some_url', { method:'get' });
最初のパラメーターはリクエストのURLです。2番目はオプションハッシュです。methodオプションは、使用されるHTTPメソッドを参照します。デフォルトのメソッドはPOSTです。
AJAX応答コールバック
Ajaxリクエストはデフォルトで非同期です。つまり、レスポンスからのデータを処理するコールバックが必要です。コールバックメソッドは、リクエストを行うときにオプションハッシュで渡されます-
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...') }
});
ここでは、2つのコールバックがハッシュで渡されます-
- onSuccess
- onFailure
上記の2つの呼び出しはいずれも、応答のステータスに基づいてそれに応じて呼び出されます。両方に渡される最初のパラメータは、ネイティブでのXMLHttpRequestあなたがその使用することができ、そこからオブジェクトresponseTextとresponseXMLを、それぞれの特性を。
両方のコールバックを1つまたはまったく指定できません。それはあなた次第です。他の利用可能なコールバックは-
- onUninitialized
- onLoading
- onLoaded
- onInteractive
- onComplete
- onException
他のコールバックのディスパッチ中に例外が発生したときに発生するonExceptionを除いて、これらはすべてxmlHttpRequestトランスポートの特定の状態に一致します。
NOTE− onUninitialized、onLoading、onLoaded、およびonInteractiveコールバックは、すべてのブラウザーで一貫して実装されているわけではありません。一般に、これらの使用は避けるのが最善です。
プロトタイプAJAXメソッド
Ajaxオブジェクトは、AJAXリクエストとレスポンスを簡単な方法で処理するために必要なすべてのメソッドを提供します。これは、AJAXに関連するすべてのメソッドの完全なリストです。
NOTE −少なくともprototype.jsのバージョン1.6を使用していることを確認してください。
S.No. | 方法と説明 |
---|---|
1.1。 | Ajaxオプション これはメソッドではありませんが、すべてのAJAXリクエスターとコールバックによって共有されるすべてのコアオプションの詳細です。 |
2.2。 | Ajax.PeriodicalUpdater() 定期的にAJAXリクエストを実行し、レスポンステキストに基づいてコンテナのコンテンツを更新します。 |
3.3。 | Ajax.Request() AJAXリクエストを開始して処理します。 |
4.4。 | Ajax.Responders() プロトタイプベースのAJAXリクエストのすべてのステップについて通知されるグローバルリスナーのリポジトリ。 |
5.5。 | Ajax.Response() すべてのAjaxリクエストコールバックの最初の引数として渡されたオブジェクト。 |
6.6。 | Ajax.Updater() AJAXリクエストを実行し、レスポンステキストに基づいてコンテナのコンテンツを更新します。 |