WCFで構築したRESTなサービスのレスポンスをJQueryで解釈する

投稿日: 投稿者: NAL-6295

前回のWCFでRESTなサービスを例にあげて、レスポンスをJQueryで解釈してみたいと思います。

レスポンスからエレメントID=UserListなSelectタグの選択肢として展開するサンプルです。

レスポンスは以下のようなxmlを想定しています。

<ArrayOfUser xmlns="http://schemas.datacontract.org/2004/07/sample" xmlns:i="http://www.w3.org/2001/XMLSchema-instance">
<User>
<Id>0001</Id>
<Name>テスト太郎</Name>
</User>
<User>
<Id>0002</Id>
<Name>テスト花子</Name>
</User>
</ArrayOfUser>

例によってコメントで説明します。

function ユーザリスト設定()
{
$.get(
"/sample/Service1.svc/User/",
{},
function(data){
var value = "";
//レスポンスの解釈をしているのはこの部分だけです。
//レスポンスとして帰ってきたdataの中の
//Userというタグをfindで検索し、
//見つかったら都度each内に定義してある無名関数を実行しています。
//無名関数の中では、それぞれUserタグの中にあるIdとNameという要素を検索し、
//それぞれの要素に定義されている値を利用してselectタグに設定するoption要素を生成しています。
result = $(data).find("User").each(function(){
value += "<option value='"+ $(this).find("Id").text()  +  "'>" + $(this).find("Name").text() + "</option>";
});
//Selectタグに生成したoption要素を設定。
$("#UserList").html(value);
});
}

このようにJQueryを利用して比較的簡単にXMLとして返ってきたレスポンスを解釈して展開することが可能だという事がわかります。

Share