SPServicesは、 Mark Andersonによって作成されたjQueryライブラリであり、クライアント側でSharePoint 2007/2010/2013 Webサービスを簡単に操作できます。 ライブラリには、現在のユーザーの取得からリストアイテムの更新まで、データ操作のための多くの機能が含まれています。
例として、最も一般的なタスクの1つであるリストからデータを取得し、ページの[人物]リストにIvanovという名前のすべての従業員を表示するソリューションを見てみましょう。
開始するには、ライブラリのGetListItems関数を使用して、必要な要素を含むJSONオブジェクトを取得します。
<script type="text/javascript" src="/SiteAssets/libs/SPServices.js"></script> <script> var JSONdata; $(document).ready(function() { $().SPServices({ operation: "GetListItems", webURL: "/PeopleDataWeb", async: false, listName: "People list", CAMLQuery: "<Query><Where><Eq><FieldRef Name='LastName' /><Value Type='Text'></Value></Eq></Where></Query>'; CAMLViewFields: "<ViewFields><FieldRef Name='FirstName' /><FieldRef Name='LastName' /><FieldRef Name='Age' /></ViewFields>", completefunc: function (xData, Status) { JSONdata = $(xData.responseXML).SPFilterNode("z:row").SPXmlToJson({ mapping: { ows_FirstName: {mappedName: "FirstName", objectType: "Text"}, ows_LastName: {mappedName: "LastName", objectType: "Text"}, ows_Age: {mappedName: "Age", objectType: "Integer"} }, includeAllAttrs: true }); } }); }); </script>
ここで何が起こるか考えてみましょう:
- 操作では、操作のタイプを設定します。 操作には多くの種類がありますが、 ドキュメントでは便利にオブジェクトごとにグループ化されています。
- webURLを使用すると、必要なリストがあるホストの相対アドレスを指定できます。 このパラメーターはオプションであり、明示的に指定しない場合、現在のノードが使用されます。
- asyncパラメーターは、非同期操作を指定します。 デフォルトはtrueです。
- listName-ここでは、はっきりしていると思います。 リストの表示名(DisplayName)が示されます。 {GUID}として指定できます。 重要な点:リストは、GUIDで指定した場合でも、webURLパラメーターで指定したサイト上にある必要があります。
- CAMLQueryを使用すると、リストアイテムのCAMLクエリを指定できます。 指定しない場合、すべてのアイテムが選択されます。 たとえば、リストから姓Ivanovを持つすべての従業員を取り上げます。
- CAMLViewFieldsでは、必要なリストフィールドを指定する必要があります。
- completefunc関数では、Webサービスへのリクエストが成功したときに何が起こるべきかを説明します。 この例では、JSONの形式でデータを受信することに関心があるため、XML応答の解析とJSONへの変換にそれぞれ、SPFilterNodeとSPXmlToJsonの2つのライブラリ関数を使用します。 後者のマッピングパラメータを使用すると、リスト列の内部名(内部名)を指定し、JSONのフィールドにマップして、タイプを示すことができます。
したがって、クライアント側にJSONがあります。 この例を完了するには、ページに表示します。 TelerikのKendo UIフレームワークを使用します。これにより、ページにデータを簡単に表示できます。
<link href="/SiteAssets/kendo/styles/kendo.common.min.css" rel="stylesheet" /> <link href="/SiteAssets/kendo/styles/kendo.default.min.css" rel="stylesheet" /> <script src="/SiteAssets/kendo/js/kendo.kendo.min.js"></script> <script src="/SiteAssets/kendo/js/kendo.all.min.js"></script> <script> $("#grid").kendoGrid({ columns: [ { title: "First name", field: "FirstName" }, { title: "Last Name", field: "LastName" }, { title: "Age", field: "Age" } ], dataSource: { data: JSONdata, }, height: 600 }); </script> <div id="grid"></grid>
使用された文献:
- SPServicesドキュメント -ライブラリの機能に関する非常に詳細なドキュメント。
- SPServicesの実際の例:電話リストガジェットはやや時代遅れですが、使用例です。
- SharePointとjQueryのダミーガイド-SPServicesを使用したリストデータの読み取り -およびその他。
質問、希望、呪いがある場合は、コメントを歓迎します。