Framework・Office365を中心に扱うブログです。Framework(以下SPFx)のフィールドカスタマイザーではJavaScriptコードを動かせるので柔軟なカスタマイズが可能です。今回はフィールドカスタマイザーのサンプルとして、ビューに完了ボタンを表示させて列の値を更新するようにしてみました。「完了」列を更新するトグルボタンを実装したSharePointリストに「完了」列を用意して、トグルボタンで値を変更できるようにカスタマイズしました。「完了」列の種類は「はい/いいえ」にしています。カスタマイズしていない標準ビューでは以下ように表示されます。標準の見た目これだとアイテムの完了状態を変更するのに、クイック編集とかプロパティ編集とかが必要になって面倒ですよね。モダンビューの書式設定機能では、見た目を変えられますが値の編集まではできません。フィールドカスタマイザーの出番ですね。中身の概説SPFxの開発環境が整っていることを前提として進めます。SPFx初体験の方は先に以下を参照してください。今回のサンプルで利用する「完了」列を追加しました。ビューに「完了」列と「ID」列を表示しました。その他の設定はサンプルに影響しません。自分に見やすくしてあります。:はい/いいえ注)フィールドカスタマイザーでは、JSLinkと同様に「ビューに表示されている列しか扱えない」という制約があります。そのためカスタマイズ対象である「完了」列と更新のキーである「ID」列の表示が必須です。SPFxソリューションの構成ソリューションを作成するコマンドは以下のとおりです。yoコマンドのパラメータソリューションが出来たら、Configフォルダ内のserve.jsonを編集します。プロパティ名をカスタマイズ対象の列内部名に置き換え環境に合わせてserve.jsonを編集とりあえずこれだけでも初期コードを動かせます。serveコマンドを実行してみてください。皆さんは大丈夫だと信じています。SharePointがブラウザに出してくるURLパラメータ付きのものでは動きません。コードを編集していきます。Reactコンポーネント(.tsファイル)を以下のようにしました。}}言われるがままにトグルを表示してコールバックするだけの非常にシンプルなコンポーネントです。続いてフィールドカスタマイザー(.tsファイル)のコードです。該当アイテムの完了列を更新します。alert('アイテムIDが取得できませんでした。ビューにID列を含めていることを確認してください。実際のプロジェクトではヘルパークラス的なものにSharePoint関連をまとめるなどしたほうが良いでしょうね。Post時のリクエストヘッダ今回はアイテム更新なので上記5つが必要です。APIのリファレンスなどが参考になります。__metadataの値ListItemEntityTypeFullNameと呼ばれるものです。本来は動的に取得すべきものです。以下のURLにGETリクエストすれば得られます。GETなのでとりあえず知りたいだけならブラウザで叩けます。(サイトURL)_api/web/lists/GetByTitle('リスト名')ソースコード全体GitHubに公開予しています。ReadMeは英語です。github.com以上、参考になれば幸いです。365のプロファイルに設定したユーザーのサムネイル画像を簡単に取得する方法いっつも忘れちゃうので自分用メモ。復旧)【2019年11月時点最新】Flowの新ライセンス形態まとめSharePointでリストのコピーができるようになりました月別アーカイブはてなブログをはじめよう!micknabewataさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。