リストの特定のフォルダー内にあるアイテムを JavaScript から取得する

JavaScript
スポンサーリンク

「リスト内にフォルダーが作成されており、その特定のフォルダー内のアイテムの一覧を JavaScript から取得する」という、良く利用されそうなシナリオですが、なかなか情報が見つからない(特に日本語では)という声を聞いたので、自身の備忘録も兼ねて投稿します。

サンプルとなるリストの準備

リストは、お知らせリストで「NewsList」という名前で作成し、「MyFolder」というフォルダーを作成しました。そして、そのフォルダーの外側に「Out_Folder1-3」の3つのアイテムを投稿し、さらにフォルダーの内側に「In_Folder1-3」の3つのアイテムを投稿しました。つまり、「In_Folder1-3」がうまく取得できれば成功です。

20140616-1
20140616-2

さっそくスクリプトを作成

今回作成した JavaScript です。利用時には Function として定義し、ボタンなどから呼び出す想定で作成しました。

var ctx = SP.ClientContext.get_current();
var web = ctx.get_web();
var list = web.get_lists().getByTitle('NewsList');
var rootFolder = list.get_rootFolder();

ctx.load(rootFolder);
ctx.executeQueryAsync(
	function(sender, args){
		//succeeded.
		var listUrl = rootFolder.get_serverRelativeUrl();
		var query = new SP.CamlQuery();
		
		query.set_folderServerRelativeUrl(listUrl + '/MyFolder');
		var items = list.getItems(query);
		
		ctx.load(items);
		ctx.executeQueryAsync(
			function(sender,args){
				//succeeded.
				var str = '';
				var itemsEnum = items.getEnumerator();
				while(itemsEnum.moveNext()){
					str = str + itemsEnum.get_current().get_item('Title') + '\n';
				}
				alert(str);
			},
			function(sender, args){
				//failed.
			});
	},
	function(sender, args){
		//failed.
	});

ややこしいことをしているように見えますが、ポイントとなるのは一点だけで、13行目でSP.CamlQuery.folderServerRelativeUrlプロパティにフォルダーのサーバー相対 URL をセットし、クエリの範囲を指定していることです。

SP.CamlQuery.folderServerRelativeUrl property (sp.js)
http://msdn.microsoft.com/en-us/library/office/jj246146(v=office.15).aspx

今回は、リストのサーバー相対 URL も同じ JavaScript の中で取得しましたが、直接文字列でスクリプトに埋め込んでも良ければもっとシンプルになります。ちなみに、上記を実行すると下図のようなダイアログが表示されます。

20140616-3

さいごに

こうしたスクリプトの記述は、知っているととても便利に利用ができる SharePoint 独自 JavaScript モデル(JSOM)に基づいています。また何か気になったら投稿したいと思います。

タイトルとURLをコピーしました