SharePoint

SharePoint Designer でリボン内にメニュー作成 – 他のサイトにお知らせコピー

  • 2014.12.25

こんばんは、奥田です。昨日の投稿で SharePoint Designer を利用したカスタム アクション作成 (ワークフロー起動ボタン) をご紹介しました。今日はカスタム アクション作成 JS 書ける人向けバージョンです。

SharePoint Designer でカスタム アクションを作成する場合、独自で作成したボタンクリック時の操作として、URL も指定できます。ここで JavaScript を指定することでボタンクリック時にさまざまな操作を組み込めます。

SharePoint はサイト内のほとんどの操作が JavaScript で操作できる API が用意されているため、標準機能だとすこし手が届かないような機能を、カスタム アクションと JavaScript を組み合わせてカスタマイズしてみます。

たとえば、下記は別のサイトにお知らせ データをコピーする例です。

javascript:var context=SP.ClientContext.get_current();var clientContext=new SP.ClientContext(‘別サイトURL’);var web=context.get_web();context.load(web);var source=web.get_lists().getByTitle(‘お知らせリスト名’);var oList = clientContext.get_web().get_lists().getByTitle(‘書き込み先サイトのお知らせリスト名’);clientContext.load(oList);var currentItem = source.getItemById({SelectedItemId});context.load(currentItem);context.executeQueryAsync(Function.createDelegate(this,copyItem),Function.createDelegate(this,error));function copyItem(sender, args){var itemCreateInfo = new SP.ListItemCreationInformation();var oListItem = oList.addItem(itemCreateInfo);oListItem.set_item(‘Title’, currentItem.get_item(‘Title’));oListItem.update();oList.update();clientContext.executeQueryAsync(Function.createDelegate(this,copyCompleted),Function.createDelegate(this,error));}function error(sender, args){alert(args.get_message());}function copyCompleted(sender, args){alert(‘コピーしました!’);}

組み込み方は次のとおりです。

    1. SharePoint Designer 2013 で対象のサイトを開きます。
    2. [サイト オブジェクト] より [リストとライブラリ] をクリックします。
    3. リストとライブラリの一覧が表示されます。対象のリストもしくはライブラリをクリックします。
    4. リボンより、[ユーザー設定のアクション] – [リボンの表示] をクリックします。
    5. [ユーザー設定のアクションの作成] ダイアログ ボックスが表示されます。
      次の設定を行い [OK] をクリックします。
      ● 名前:任意のメニュー名
      ● アクションの種類:[URLへの移動] を選択し、上記スクリプトを改行やスペースなしで挿入
      ● ボタンイメージのURL:メニューに表示したい画像ファイルのパスを指定

CAAnoリスト ビュー Web パーツを利用してお知らせ新着データをトップページに表示することは、SharePoint 基本としてよく利用する機能ですが、リストビュー Web パーツは同じサイト内でのみという仕様制限があるため、他のサイトにお知らせデータを一覧表示したい場合、クエリ結果 Web パーツを利用するとかコンテンツ検索 Web パーツを利用するなど、少し設定の難易度が上がります。クエリ結果 Web パーツやコンテンツ検索 Web パーツを利用しても、リスト ビュー Web パーツのように、表形式での一覧表示は標準でできないので、なかなか悩ましいですよね。

いっそ、お知らせを表示させたい他サイト内のお知らせ リストに、お知らせデータを表示したいものだけ、このボタンをクリックしてデータをコピーさせてしまえ!そしてリストビュー Web パーツで表示したい! というカスタマイズ例です。
(以前勉強会かなにかでしゃべった内容を記事にしました)

SharePoint 2013 で利用できる JavaScript API は下記が参考になります。http://msdn.microsoft.com/ja-jp/library/office/jj163201(v=office.15).aspx

SharePoint 関連コース

  • CI635-H SharePoint Server サイト構築
    SharePoint Server のサイト管理やサイト構築を行う方を対象に、サイト構築や運用管理に必要となる基本スキルやサイト構築方法を習得いただけるコースです。これから SharePoint の管理を行う IT 管理者の方や、サイト管理やサイト構築を行う担当者の方に最適です。Subscription Edition に対応しており、アップデートによる新しい機能やこれまでとの差異も含めて解説!
  • CI639-H SharePoint Server から SharePoint Online への移行 – SPMT 実践
    Microsoft が提供する無償ツール 「SharePoint Migration Tool」 による、オンプレミスの SharePoint Server (2016 / 2019) から、SharePoint Online を中心とした Microsoft 365 環境への移行方法を解説します。SPMT を用いた一連の移行手順を体験することで、ツールの設定方法やログの読み方、移行後の検証作業など、実運用に直結するスキルを習得いただけます。
  • CI620-H SharePoint Framework 開発 基礎
    SharePoint Framework (SPFx) を利用すると独自の Web パーツ開発や、ヘッダー・フッターのカスタマイズなど、さまざまな独自機能を開発し、追加することが可能です。これから SharePoint Framework の開発を行う方を対象に知っておくべき内容を 2 日間に集約して体系的に解説!

お問い合わせ

イルミネート・ジャパンが提供するトレーニングやサービスに関するご相談など、
お気軽にご連絡ください。

担当者に相談する