kintoneの関連レコードは、表示しているレコードに関連するレコードを表示できる、とても便利な機能です。ただ、余り細かい設定が出来ません。例えば、左側に詳細画面へのリンクがあるのですが、これを消す設定はありません。

今回は、Customineを使ってこの詳細画面へのリンクをちょっと違った方法で消したように見せるカスタマイズをご紹介します。


ちなみに、標準の表示とカスタマイズだと、表示の違いは次のようになります。


●標準の表示


●カスタマイズで実現した表示


同様の表示が実現できているのがおわかりいただけるでしょうか?


kintoneアプリのフォーム設定の確認

今回サンプルとして利用するkintoneアプリは、kintoneアプリストアの人事労務パックに含まれている従業員名簿を使います。


カスタマイズを試す前に、アプリの中央部分にある「配属・異動の記録」の箇所にスペースフィールドを設定し、要素IDを「haizoku_ido」と設定しておきます。


カスタマイズの全体の流れ

カスタマイズの全体の流れとしては
・関連レコードを非表示にする

・値が変わった時の再描画で動くアクションを設定する

・詳細画面、編集画面での初期表示条件を設定する

・上の2つの条件どちらかが動いたときにスペースに表示を行う


となります。


関連レコードの非表示

まずは、関連レコードを非表示にしておきます。


やること「フィールドやグループを非表示にする」、条件「追加画面・編集画面・詳細画面のいずれかを表示した時」を使います。


値が変わった時の再描画で動くアクションを設定

詳しくは レコードの一覧をスペースに表示するで表示した一覧を再表示できますか? も併せて参照して頂きたいのですが、やること「レコードの一覧をスペースに表示する」を再表示する必要がある場合は、同じアクションが動いて再表示が行われるよう、カスタマイズを構成する必要があります。

※同じアクションが動いた時はスペースへのレコード一覧の表示が再描画され、別のアクションにすると併記される という動きになるため。


このため、やること「なにもしない」を使いつつ、狙った条件の時に動くアクションを複数作って動くようにしておき、後続のアクションで条件「いずれかのアクションの実行が完了した時 」を使い、後続処理で実際の処理を行う という作りのカスタマイズを作る必要があります。


ここでは値が変わった時の再描画の起点になるアクションを指定します。


やること「なにもしない」、条件「フィールドの値を編集して値が変わった時」を使います。


詳細画面、編集画面での初期表示条件を設定

前提となる考え方は上の説明と同じです。ここでは画面の初期表示時の起点になるアクションを指定します。


やること「なにもしない」、条件「追加画面・編集画面・詳細画面のいずれかを表示した時」、「フィールド値が空でないならば」を使います。


スペースへの表示を行う

スペースへの表示処理はレコードを取得し、それをやること「レコードの一覧をスペースに表示する」で表示する という流れになります。


やること「関連レコード一覧の条件でレコードを取得する」、条件「いずれかのアクションの実行が完了した時」で関連レコードを取得します。この時のポイントは既にお伝えしていますが、条件が「いずれかのアクションの実行が完了した時」になっている事です。


その後、やること「レコードの一覧をスペースに表示する」を使います。

パラメータ「場所」には「haizoku_ido」(上述したものですが、アプリに足したスペースフィールドの要素ID)、また「レコードへのリンク」は「リンクを表示しない」を選んでください。
※なお「リンクを表示する」とすると、関連レコードフィールドの様にリンクを表示させる事もできます。


これでカスタマイズは完成しましたので、「kintoneアプリへ登録」をクリックして、実際の動きを確認してみてください。


なお、最終的なカスタマイズは次のようになり、


アクショングラフは次のようになります。


同じ動きにならなかった時は、上のカスタマイズやアクショングラフと見比べてみてください。


まとめ

やること「レコードの一覧をスペースに表示する」を活用すると、関連レコードよりもより柔軟に、関連するレコードの表示を実現することができます。


また、 関連レコードが多い場合にはスクロールします(人によってはこちらのほうが使いやすいかもしれません)。

スマートフォン(モバイル)版の画面でも動作しますので、ぜひ色々なシーンでご活用下さい!


お試しいただいてご不明な点がございましたら、チャットでお気軽にお問合せください。