1.事前準備
ここでは、kGridのメイン機能である「グリッド表示モード」の設定を行います。
参考
「グリッド定義定義モードの設定」「グリッド表示モードの設定」の違いを解説しておりますで、まずこちらをお読みください。設定作業がスムーズになります。
グリッド表示とは
kGridでは、グリッド定義の各マス目に対してレコードをはめ込み表示することをグリッド表示と呼んでいます。
ここではkGridを使った画面設定イメージをしやすいように、マンションの修繕工事に関わる部屋ごとのバルコニー工事の予定の管理を例に、設定方法を解説していきます。(以下の「バルコニー工事予定アプリ」に対して、グリッド表示モードの設定を行います)

アプリの事前準備
まず、グリッド表示設定を行いたいアプリを用意します。アプリには次のフィールドを事前に用意しておきます。
| フィールド | 必須/任意 | フィールドタイプ | 説明 |
|---|---|---|---|
| キー1フィールド | 必須 | 次のいずれか ・文字列(1行) ・数値 ・ラジオボタン ・ドロップダウン | グリッド定義アプリのキー1に対応するフィールド。 (例) 物件マスタの場合、物件コード。 |
| キー2フィールド | 任意 | 次のいずれか ・文字列(1行) ・数値 ・ラジオボタン ・ドロップダウン | グリッド定義アプリのキー2に対応するフィールド。 (例) 部屋マスタの場合、物件コード+部屋番号。 |
| 列番号に対応するフィールド | 必須 | 数値 | グリッド定義の列番号(横軸)の位置情報を保存するフィールド。 ここに保存された位置情報を元にして、グリッドのどこに表示するかの制御が行われる。 一番左の列から1、2,3・・と連番。 |
| 列番号ラベルに対応するフィールド | 任意 | 文字列(1行) | グリッド定義の列番号(横軸)に表示している文字を保存するフィールド。 文字情報として必要な場合のみ設定する。 |
| 行番号に対応するフィールド | 必須 | 数値 | グリッド定義の行番号(縦軸)の位置情報を保存するフィールド。 ここに保存された位置情報を元にして、グリッドのどこに表示するかの制御が行われる。 一番上の行から1、2,3・・と連番。 |
| 行番号ラベルに対応するフィールド | 任意 | 文字列(1行) | グリッド定義の行番号(縦軸)に表示している文字を保存するフィールド。 文字情報として必要な場合のみ設定する。 |
| サブキー | 任意 | 次のいずれか ・文字列(1行) ・数値 ・ラジオボタン ・ドロップダウン ・日付 | グリッド定義を設定したアプリのキーフィールドの他に、キーとしたいフィールドを用意する。 (例) 日別や分類ごとにグリッド内の情報を持ちたい場合 |
参考
この例の場合、必須項目の中では「列番号に対応するフィールド」「行番号に対応するフィールド」が無いため、「バルコニー工事予定アプリ」に対してフィールドの追加を行います。

グリッド表示用一覧の作成
グリッド定義モードを表示するために、一覧へのグリッド表示用のHTMLタグを設定を行います。
まず、プラグイン設定画面を開き、処理モードを「グリッド表示モード」にします。「グリッド表示モード用HTMLタグ」が表示されますので、コピーボタンをクリックしてクリップボードにコピーします。

次に、グリッド表示用の一覧を作成します。
- レコード一覧の表示形式:カスタマイズ
- HTML:コピーしたHTMLタグを張り付け
- ページネーションの表示:なし(チェックを外す)

設定が終わったら保存し、アプリを更新します。
プラグイン設定画面を開く
グリッド表示を行いたいアプリ(上記で事前準備したアプリ)の設定画面を開いたのち、設定タブ -> カスタマイズ/サービス連携 -> プラグインをクリックします。アプリに追加されているプラグインの中から、本プラグインを選び、設定ボタンをクリックします。

プラグイン設定画面では、処理モードは「グリッド表示モード」を選択します。

2.グリッド定義アプリとの紐づけ
グリッド定義を行ったアプリと自アプリの紐づけをまず行います。
グリッド定義を行ったアプリの参照設定
ここでは、グリッド定義を行ったアプリの選択と、自アプリ(グリッド表示を行うアプリ)への位置情報(行番号・列番号)の保存先フィールドを設定します。

| 項目名 | 説明 |
|---|---|
| 参照先アプリ | グリッド定義モードの設定を行ったアプリを選択。 |
| グリッド定義情報フィールド | 参照先アプリのグリッド定義情報フィールドを選択。 |
| X軸ラベルの表示有無 | X軸(列ラベル)を表示するかどうかを選択。 |
| Y軸ラベルの表示有無 | Y軸(行ラベル)を表示するかどうかを選択。 |
| 列番号の保存先フィールド | グリッド定義の列番号(X軸)の位置情報を保存するフィールドを選択。 ここに保存された位置情報を元にして、グリッドのどこに表示するかの制御が行われる。 一番左の列から1、2,3・・と連番。 |
| 列番号ラベルの保存先フィールド | グリッド定義の列番号(X軸)に表示している文字を保存するフィールドを選択。 文字情報として必要な場合のみ設定する。 |
| 行番号の保存先フィールド | グリッド定義の行番号(Y軸)の位置情報を保存するフィールドを選択。 ここに保存された位置情報を元にして、グリッドのどこに表示するかの制御が行われる。 一番上の行から1、2,3・・と連番。 |
| 行番号ラベルの保存先フィールド | グリッド定義の行番号(Y軸)に表示している文字を保存するフィールドを選択。 文字情報として必要な場合のみ設定する。 |
グリッド定義を行ったアプリとのキーの紐づけ設定
ここでは、グリッド定義を行ったアプリのキーに対して、自アプリのフィールドとの紐づけを行います。このキー情報は、グリッド表示モードで表示した際の、データの絞り込みに使用されます。

| 項目名 | 説明 |
|---|---|
| 参照先アプリのキーフィールド | グリッド定義モードの設定を行ったアプリのキーフィールドを選択。 |
| 自アプリの保存先フィールド | キーフィールドに対応する自アプリのフィールドを選択。 |
| リスト表示フィールド | グリッド表示モードで表示した際の、データ絞込用リストの選択肢として使用するフィールドを選択。 |
| リストのラベル | データ絞込用リストのラベル名を指定。 |
| ソート順 | データ絞込用リストの並び順を指定。 |
| 「キーを追加」ボタン | グリッド定義モードの設定を行ったアプリにおいて「キー2」を使用している場合は、このボタンをクリックしてキー2としての情報を設定。 |
補足
ここで設定したリスト設定内容は、グリッド表示モードで使用する際の、画面右上に表示されます。
この例の場合、物件コードをキーとして使用しており、リストの選択肢には物件名を表示するような設定としています。

グリッド表示モードのキー表示部分(キー1のみ設定した場合)
3.サブキーの定義
グリッド定義した内容に対して、別の項目もキーとして管理したい場合、「サブキー」を設定します。
例えばここで紹介する例の場合、次のようなアプリ構成となっています。
- グリッド定義用アプリ:物件マスタ
- セルラベル定義用アプリ:住戸マスタ(部屋マスタ)
- グリッド表示用アプリ:バルコニー工事予定アプリ
バルコニー工事予定アプリでは、物件 + 住戸(部屋) + 日付ごとにレコードを管理したいので、「日付」がサブキーに該当します。

サブキーの種類は、「日付」「フィールド選択肢を参照」「別アプリを参照」の3つから選択することができます。
サブキーの種類を「日付」とする場合
日付としては3種類(年月日、年月、年)から選択することができ、これらを自アプリに保存する際は日付フィールドを指定することができます。

補足
この設定をすることでグリッド表示をした際は、日付ごとにレコードを保存することができるようになります。

サブキーの種類を「フィールドの選択肢を参照」とする場合
フィールドの選択肢を参照する場合、参照フィールドのタイプは「ドロップダウン」「ラジオボタン」から選択できます。自アプリの保存先フィールドは選択したフィールドタイプから選択します。

補足
この設定をすることでグリッド表示をした際は、サブキーのリストにはフィールドの選択肢が表示されるようになります。

サブキーの種類を「他アプリを参照」とする場合
他アプリを参照とする場合、参照先アプリのレコードの値が選択肢として表示することができるようになります。マスタ系のアプリをサブキーで切り替えて登録させたい場合に利用します。

補足
この設定をすることでグリッド表示をした際は、サブキーのリストにはレコードの値が選択肢に表示されるようになります。

4.セルの定義
ここでは、グリッド表示時の各セルの見た目を設定します。まずは初期値で表示して見た目を確認し、変えたい部分がある場合にのみ変更してください。

| 項目名 | 説明 |
|---|---|
| 全般 ・最小の幅、最大の幅 ・文字色、背景色、枠線色、枠線の太さ | グリッドのマス目(セル)の見た目を設定。 表示されるセルの数が少ない場合は幅・高さ共に画面の表示エリアいっぱいに表示されますが、セルの数が多い場合は最小の幅、最小の高さでサイズが調整される。 文字色は、グリッド内のセルラベル(位置情報)に適用される。 |
| 入力不可セル ・文字色、背景色、枠線色 | グリッド定義で入力不可としたマス目(セル)への見た目を設定。 |
| データが存在しないセル ・未登録タグの表示有無 ・タグへの表示文字、文字色、背景色、文字の太さ | グリッドのマス目(セル)に表示する自アプリのレコードが無い場合の見た目を設定。 未登録タグを表する場合、セルに右上に文字が表示される。 <例> |
5.セルラベルの定義
ここでは、マス目(セル)内に表示するラベルの設定を行います。
ラベルフォーマットを列番号・行番号を元に表示する場合
「ラベルフォーマット」から表示形式を選択します。

ラベルフォーマットを「他アプリから参照」とする場合
他アプリのレコードを元にセルラベルを表示したい場合は、この設定を行います。

| 項目名 | 説明 |
|---|---|
| 参照先アプリ | どのアプリをセルラベル用として使用するかを選択。 |
| ラベル用フィールド | 参照先アプリのどのフィールドをセルラベルとして表示するかを選択。 |
| キー1に対応するフィールド キー2に対応するフィールド | グリッド定義を行ったアプリのキーに該当するフィールドが、参照先アプリのどのフィールドに該当するかを選択。 |
| 列番号に対応するフィールド | 参照先アプリの中で、列番号(横軸)の位置情報を表すフィールドを選択。 ここに保存された位置情報を元にして、グリッドのどこに表示するかの制御が行われる。 一番左の列から1、2,3・・と連番。 |
| 行番号に対応するフィールド | 参照先アプリの中で、行番号(縦軸)の位置情報を表すフィールドを選択。 ここに保存された位置情報を元にして、グリッドのどこに表示するかの制御が行われる。 一番左の列から1、2,3・・と連番。 |
補足
この例の場合、「住戸マスタ(部屋マスタ)」をセルラベル用の参照先アプリとし、「住戸番号」をセルラベルとして表示します。設定としては次のような形で設定を行います。

設定のイメージ

表示のイメージ
6.セルの色付け定義
グリッドの各セルに表示対応するレコードの情報を元にして、セルへの色付けをすることができます。色付け表示をしたい場合はここに設定します。

| 項目名 | 説明 |
|---|---|
| 色付け定義名 | 色付け定義名を設定。 ここで設定した名称は、グリッド表示時の右上に表示される。 |
| セル内への凡例表示有無 | グリッドのマス目(セル)に凡例を表示するかどうかを設定。 |
| 凡例タブ(複数設定可能) ・凡例 ・セル内の凡例表示内容、セル内の凡例、文字サイズ ・文字色、背景色、装飾 ・色付け条件 | 凡例と色付け内容・条件を設定。 ・「凡例」とは、画面右上に表示する凡例 ・「セル内の凡例」とはセル内に表示する凡例。画面右上の凡例とは別の文字で表示したい場合に使用。 ・タブをクリックすると、1つの色付け定義に対して複数の凡例を表示することが可能。 |
補足
凡例は複数設定することができ、画面右側の「切替」ボタンから切り替えることが可能です。

7.一括編集定義
グリッド内のマス目(セル)をマウスのドラッグで範囲選択した際にボタンを表示し、一括編集(登録・更新)を行うことが可能です。表示されているセルに対して一括編集を行いたい場合は、本定義を行います。

| 項目名 | 説明 |
|---|---|
| ボタンラベル | グリッドのマス目(セル)を範囲選択した際に表示するボタンのラベルを設定。 |
| 備考 | 必要に応じて設定。 |
| ボタン文字色、背景色、枠線色、枠線の太さ | 編集ボタンの装飾を設定。 |
| 編集対象フィールド(複数設定可能) ・フィールド ・表示オプション ・初期値設定方法 ・初期値 | 編集ボタンをクリックした際に、どのフィールド編集するかを設定 ・「表示オプション」とは、編集ボタンクリック時に表示する編集画面上の処理・見た目を制御するもの。 ・「初期値設定方法」では、「個別設定」と「フィールドの初期値」の2つから選択。個別設定の場合は初期値を設定する。 |
| 編集画面の表示有無 | 編集ボタンをクリックした際に、編集画面を表示するかどうかを設定。 表示する場合:画面右側に編集対象フィールドが表示される。 表示しない場合:画面右側に編集対象フィールドが表示されない。 【補足】 編集ボタンクリック時に初期値ですぐに保存したい場合は「保存しない」を選択。 |
| 保存時の確認ダイアログの表示有無 | 編集画面の保存ボタンをクリックした際に確認ダイアログを表示するかどうかを設定。 表示しない場合、保存ボタンクリック後すぐに登録・更新処理が行われる。 |
補足
「編集画面の表示有無」が”表示しない”、かつ、本設定も”表示しない”とした場合、編集ボタンクリック後すぐに登録・更新処理が行われます。

8.グリッド表示モードの利用
以上でグリッド表示モードとしての設定は完了です。プラグイン設定を保存後、アプリを更新してください。
グリッド表示モードを設定したアプリを開き、実際に操作をお試しください。
9.参考:その他の機能
マニュアル/お問い合わせ

プラグインの設定・操作マニュアルの確認や、プラグインに関する質問などのお問い合わせは、タブ右側の?アイコンから行うことができます。
プラグイン設定のエクスポート・インポート

プラグインの設定をファイルにエクスポートしたり、設定ファイルをインポートは、タブ右側の歯車アイコンから行うことができます。カードやサイドパネルに対して文字色や背景色の調整を行う際は、一度エクスポートしてから行うことで、すぐに元に戻すことができます。
最後に
本マニュアルでは解決しない不明な点や、動作がおかしいと思われる点などがございましたら、以下よりお気軽にお問い合わせください。