レコードページの大量の項目を複数のタブに分けて表示する方法

By | April 24, 2020

概要

レコードページに大量の項目を表示する場合、「各項目をセクション分けしたうえで、あまり見ない項目を下の方に配置する」という手法で縦長の構成となるのが通常です。

本記事では各項目をセクションではなくタブに分ける方法を解説していきます。

①セクション分けしない場合

②セクション分けした場合

③タブ分けした場合

タブ分けの設定方法(標準オブジェクトの場合)

標準オブジェクトの場合、動的フォームが利用できない(=項目セクションコンポーネントが利用できない)ため、アクションを利用することで項目の切り分けを実現することになります。)

①「ボタン, アクション, リンク」から「新規アクション」をクリック

②「レコードを更新」アクションタイプで区切りたいタブごとにアクションを作成していく

③「編集ページ」をクリック

④「タブ」を設定したうえで、「関連レコード」コンポーネントを配置。「更新アクション」で先ほど作成したアクションを指定。

以上で、タブ分け実装ができました!

タブ分け実装の注意点と応用(標準オブジェクトの場合)

タブ分け実装の注意点として、セクション分けをすることができないという問題が挙げられます。

一見とても不便に感じられますが、この問題は「アコーディオン」コンポーネントを利用することで回避可能です。

以下で具体的な方法を確認していきます。

①編集ページで「アコーディオン」コンポーネントをドラッグアンドドロップ

②画面右側のアコーディオン設定で、セクションの作成・ラベル名を設定する。

③作成した各セクションに対して、必要なコンポーネントを配置する

以上で、タブ分け実装でセクション機能を実装することができました!

タブ分けの設定方法(カスタムオブジェクトの場合)

カスタムオブジェクトの場合、動的フォーム(=項目セクションコンポーネント)を利用できるため、タブで切り分けたい単位でアクションを作成する必要がありません。

「編集ページ」において、アコーディオンコンポーネントの代わりに項目セクションコンポーネントを利用し、必要な項目をドラッグアンドすれば簡単に項目のタブ分けが実現できます。