タブ表示プラグイン
プラグインの概要
フィールドが増えてくると他のアプリとの参照関係を把握しきれませんよね。そこで。
プラグインを設定したアプリのルックアップフィールドと関連レコードがどこから参照されているのかをリストアップできるプラグインを開発しました。シンプルですが、開発担当者におすすめです。
このプラグインでできること
フィールドを タブで整理
重要な情報は 常に表示可
・増えすぎたフィールドをタブで仕分けることができます
・重要な情報やよく見るフィールドはタブ外に固定表示ができます
・タブの色や文字色をお好みで設定できます
設定方法
難しい設定はありません。
タブの色（通常）→選択してない時のタブの色
タブの文字色（通常）→選択してない時のタブの文字色
タブの色（アクティブ）→選択状態の時のタブの色
タブの文字色（アクティブ）→選択状態の時のタブの文字色
常に表示するフィールド→詳細画面の上部に常に表示させておきたいフィールドです。実際のフィールドはタブ内になりますが、ここで設定したフィールドの情報を擬似的にタブ外に表示さルコとができます。
実際にタブを配置するのはフィールド設定画面です。
ラベルフィールドを使ってタブの構成を決めていきます。
まずは一番上に最初のラベルを設置しましょう。このラベルが1つ目のタブとなります。
ラベルフィールドを編集し、小括弧 [ ]で文字を囲みます。ここで入力した括弧内の文字が、そのままタブ名になります。
長すぎないよう、わかりやすい名称にしましょう。
次にフィールドの配置を決めていきます。
このタブプラグインのルールは
「設置したラベルから次のラベルまでの間のフィールドが、タブ内に表示される」
となります。
画像で言うと、基本情報ラベルから契約情報ラベルの間のフィールドが、基本情報タブの内容として表示される、、、といった具合です。
最初は設定画面でタブ内のコンテンツ配置まで決めてしまおうと思いましたが、フィールド数が増えてくると設定している側もわけわからなくなってきます。笑
と言うわけで、みんなどうしているんだろうと調べていたところ、スマイルアップさんに辿り着きまして、「要素で囲ってグルーピング」と言う、非常に直感的に配置できる方法を参考にしました。
弊社のクライアントでもタブの需要はそこそこ高く、せっかくプラグイン化するならスペース設置なども省き、よりシンプルに実装できる形でブラッシュアップしたものになります。 なお、色付けやjsとCSSのアップロード、設定時のスペースフィールドの設置などが特別苦に感じない場合はスマイルアップさんが無料でタブ機能を実装するjsを提供されておりますので、是非そちらをどうぞ。
と言うわけで、みんなどうしているんだろうと調べていたところ、スマイルアップさんに辿り着きまして、「要素で囲ってグルーピング」と言う、非常に直感的に配置できる方法を参考にしました。
弊社のクライアントでもタブの需要はそこそこ高く、せっかくプラグイン化するならスペース設置なども省き、よりシンプルに実装できる形でブラッシュアップしたものになります。 なお、色付けやjsとCSSのアップロード、設定時のスペースフィールドの設置などが特別苦に感じない場合はスマイルアップさんが無料でタブ機能を実装するjsを提供されておりますので、是非そちらをどうぞ。