AJAX

AJAX (非同期 JavaScript および XML) は、非同期 Web アプリケーションの作成に使用される、相互に関連するクライアントサイド開発手法の集まりです。

AJAX を使用すると、Web アプリケーションは、表示される Web ページのユーザーエクスペリエンスに影響を与えることなく、バックグラウンドでサーバーとの間で情報を送受信できます。

GlideAjax

GlideAjax クラスを使用すると、クライアントからサーバーサイドのコードを実行できます。GlideAjax 呼び出しはスクリプトインクルードにパラメーターを渡し、命名規則を使用してこれらのパラメーターを使用できるようにします。

注:

この機能を使用するには、JavaScript のナレッジが必要です。

GlideAjax の使用：

• 使用するスクリプトインクルードの名前で GlideAjax を初期化します。
• スクリプトインクルードを作成するときは、名前フィールドをクラス名とまったく同じに設定する必要があります。
• スクリプトインクルードを作成するときは、[クライアントコール可能] チェックボックスをオンにする必要があります。
• パラメーター sysparm_name を指定します。GlideAjax は sysparm_name を使用して、使用する関数を検索します。
• 追加のパラメーターを渡すことができます。すべてのパラメーターは「sysparm_」で始まる必要があります。事前定義されたパラメーター名は使用しないでください。
  • sysparm_name
  • sysparm_function
  • sysparm_value
  • sysparm_type
• 次に、getXML() または getXMLWait() 関数を使用してコードが実行されます。

詳細については、GlideAjax API を参照してください。

非同期 GlideAjax の例

非同期 GlideAjax スクリプトには、クライアント側のコードとサーバー側のコードの 2 つの部分があります。

Hello World：サーバーから値を返す

クライアント側

このコードはクライアント (Web ブラウザー) で実行されます。クライアントスクリプト を通常通りに作成します。これにより、パラメーターがサーバーに送信され、サーバーが処理を行います。クライアントが結果を待たないように、コールバック関数を使用して結果を返し、getXML() 関数に渡します(この場合は「HelloWorldParse」と呼ばれます)。

getXMLWait() 関数には個別のコールバック関数は必要ありませんが、これによりクライアントがブロックされます。クライアント/サーバー間の通信に時間がかかる場合 (ネットワークが遅い場合など)、アプリケーションが応答せず、速度が低下しているように感じます。getXMLWait() の例は、次のセクションにあります。

var ga = new GlideAjax('HelloWorld');
ga.addParam('sysparm_name', 'helloWorld');
ga.addParam('sysparm_user_name', "Bob");
ga.getXML(HelloWorldParse);
 
function HelloWorldParse(response) {
  var answer = response.responseXML.documentElement.getAttribute("answer");
  alert(answer); }

サーバー側

上記の関数のサーバー側のコード。ビジネスルールを作成するのではなく、次の場所に移動します。 スクリプトインクルード>システム定義 新しいスクリプトを作成します以下のコードを貼り付けます。

注:

スクリプトインクルードの名前を「HelloWorld」に設定する必要があります。

• sys_script_include コードは、AbstractAjaxProcessor クラスを拡張し、クライアントが呼び出すことができる必要があります。
• 「_」で始まる関数名はプライベートと見なされ、クライアントから呼び出すことはできません。
• 「initialize」を含む AbstractAjaxProcessor のメソッドは上書きしないでください。上書きしたスーパークラスオブジェクトのメソッドを呼び出すことはできますが、複雑なため、総じて避けることをお勧めします。

var HelloWorld = Class.create();
HelloWorld.prototype = Object.extendsObject(AbstractAjaxProcessor, {
   helloWorld:function() { return "Hello " + this.getParameter('sysparm_user_name') + "!"; } ,
   _privateFunction: function() { // this function is not client callable     
    }
 });

これにより、フォームを訪問すると「Hello Bob!」というアラートボックスが表示されます。

複数の値を返す

応答は XML ドキュメントであるため、単一の answer 値しか返せないわけではありません。複数の XML ノードと属性を返す、より複雑な例を次に示します。

AJAX プロセッサースクリプトインクルード

/*
 * MyFavoritesAjax script include Description - sample AJAX processor returning multiple value pairs
 */ 
var MyFavoritesAjax = Class.create();
MyFavoritesAjax.prototype = Object.extendsObject(AbstractAjaxProcessor, {
 
	 /*
	 * method available to client scripts call using:
	 * var gajax = new GlideAjax("MyFavoritesAjax");
	 * gajax.addParam("sysparm_name","getFavorites");
	 */
	getFavorites: function() { // build new response xml element for result
         var result = this.newItem("result");
	  result.setAttribute("message","returning all favorites");
 
	  //add some favorite nodes with name and value attributes 
         this._addFavorite("color","blue");
         this._addFavorite("beer","lager");
         this._addFavorite("pet","dog");
       },
	 // all items are returned to the client through the inherited methods of AbstractAjaxProcessor
	 _addFavorite: function(name, value) { 
          var favs = this.newItem("favorite");
	   favs.setAttribute("name",name);
	   favs.setAttribute("value",value); },
 
	type:"MyFavoritesAjax"
 
 });

クライアントスクリプト

// new GlideAjax object referencing name of AJAX script include 
var ga = new GlideAjax("MyFavoritesAjax"); 
// add name parameter to define which function we want to call 
// method name in script include will be getFavorites
ga.addParam("sysparm_name","getFavorites");
 
// submit request to server, call ajaxResponse function with server response
 
ga.getXML(ajaxResponse);
 
function ajaxResponse(serverResponse) { 
  // get result element and attributes
  var result = serverResponse.responseXML.getElementsByTagName("result");
  var message = result[0].getAttribute("message");
 
  //check for message attribute and alert user
  if(message) alert(message);
 
  //build output to display on client for testing 
  var output = "";
 
  // get favorite elements 
  var favorites = serverResponse.responseXML.getElementsByTagName("favorite");
  for(var i = 0; i < favorites.length; i ++) { 
    var name = favorites[i].getAttribute("name");
    var value = favorites[i].getAttribute("value");
    output += name + " = " + value + "\n "; }
 
  alert(output); }

XML 応答

<xml sysparm_max= "15" sysparm_name="getFavorites" sysparm_processor="MyFavoritesAjax">
  <result message = "returning all favorites"></result>
  <favorite name = "color" value = "blue"></favorite>
  <favorite name = "beer" value = "lager"></favorite>
  <favorite name = "pet" value = "dog"></favorite>
</xml>

同期 GlideAjax の例

GlideAjax 応答がないとスクリプトを続行できない場合は、同期を使用します。これにより、応答を受信するまでセッションが停止します。

ユースケースで、GlideAjax 応答を受信するまでそれ以上の処理を実行できないようにする必要がある場合は、getXMLWait() を使用できます。ただし、これによりコードの速度が低下し、応答を受信するまでユーザーセッションがロックされるため、通常はコールバック関数とともに getXML() を使用することをお勧めします。

注:

AJAXEvaluateSynChronusly は使用しないでください。

注:

getXMLWait() メソッドはスコープ対象のアプリケーションでは使用できません。

このコードにより、クライアント側でアラートが生成され、「The Server Says Hello Bob!」と表示されます。

クライアントコード。

var ga = new GlideAjax('HelloWorld') ;
ga.addParam('sysparm_name','helloWorld');
ga.addParam('sysparm_user_name',"Bob");
ga.getXMLWait(); 
alert(ga.getAnswer());

サーバー側のスクリプトインクルードコード。

var HelloWorld = Class.create();
HelloWorld.prototype = Object.extendsObject(AbstractAjaxProcessor, {
helloWorld: function() 
 { return "The Server Says Hello " + this.getParameter('sysparm_user_name') + "!"; } } );

AJAXClientHelper

Ajax クライアントから値を取得するためのヘルパー関数を Ajax クライアントに提供します。

使用する状況

Ajax クライアントから値を取得する必要がある場合は、このスクリプトインクルードを使用します。

メソッドの概要

メソッドの概要	説明
getDisplay()	選択リストから表示値を取得します。

メソッドの詳細

API メソッド	説明	入力パラメーター	出力リターン
getDisplay()	選択リストから表示値を取得します。	なし	表示値。

cURL

// getDisplay
(function(table, sysId) {
    var ga = new GlideAjax('AjaxClientHelper');
    ga.addParam("sysparm_name", "getDisplay");
    ga.addParam('sysparm_table', 'incident');
    ga.addParam('sysparm_value', "0598b22b877313003c1c8467a7cb0b71");
    ga.getXMLWait();
    return ga.getAnswer();
}("incident", "0598b22b877313003c1c8467a7cb0b71")); // Returns 'INC0010001'