kintoneのレコードをマス目状のグリッド形式で表示するプラグイン「kGrid」には、グリッド定義モードとグリッド表示モードという2つのモードがあります。kGridを利用する際は、
- グリッド定義モードでマス目（セル）の枠を作る
- グリッド表示モードでマス目にデータを載せる
という流れで設定を行っていきますが、初めての場合はイメージが湧きにくい部分があります。
そこでこの記事では、kGridのグリッド定義モードとグリッド表示モードについて、その違いを分かりやすく図解していきます。2つのモードの違いのイメージを付けていただくことで、kGridの設定時に迷わなくなり、活用のイメージもつきやすくなります。
本記事で解説に使用するアプリのイメージ
本記事では、映画館のシアターの座席予約を日々行うケースで解説していきます。
※このような業務をkintoneで行うことはありえませんが、イメージが湧きやすいように映画館としています。「映画館」の部分を自社の他の業務に置き換えてお読みください。
映画館の場合、「シアター1」「シアター2」など、シアター（スクリーン）によって座席の数や配置が変わります。また、日によって予約の状況が変わります。そこで、アプリとしては次の2つを用意します。
- シアターマスタ：各シアターを管理するアプリ（マスタ用のアプリ）
- 予約管理アプリ：各シアターの座席ごとの予約状況を管理するアプリ
このような管理をkGridで行った場合を例として、グリッド定義モードとグリッド表示モードがどのように関わってくるのかを解説していきます。
サンプルアプリの概要イメージ
各シアターの座席レイアウト決め（グリッド定義）
シアターによって部屋の大きさが変わるので、それに伴い座席の数・レイアウトも変わってきます。そこでまずはじめに、各シアターの縦横の座席のレイアウトを決めていくという作業が必要になります。ここで使用するのがkGridの「グリッド定義モード」です。
グリッド定義のイメージは次の通りで、シアターの座席レイアウトを参考にして、縦横のマス目の定義をどのようにしていくかを定義していきます。
各シアターの座席定義のイメージ（グリッド定義モード）
ここでは、シアター1の場合は10行×9列、シアター2の場合は20行×24列としてみました。シアター1は左から6列目が通路、シアター2は左から8列目と16列目と11行目が通路のため、入力不可（グレーアウト）するような設定を行います。ペアシートなど他とは大きさが違うような席がある場合、マス目を結合するような定義も可能です（スクリーン1の1行目のDとEを参照）。
シアターはレコード毎に登録されていますので、シアターマスタの全レコードに対して縦横のマス目の定義（座席レイアウトの定義）を行います。これで、シアターへの座席レイアウト設定（グリッド定義）が完了です。
シアターごとに日々の座席予約を登録（グリッド表示）
次は、シアターごとに定義した座席レイアウト（グリッド定義）を元に、シアターごとの日々の座席予約を登録できるような画面を作成します。ここで使用するのが、kGridの「グリッド表示モード」です。
グリッド表示モードでプラグイン設定を行うと、次のようなイメージで画面が表示されます。
- 画面の左上には、シアター切替用のリスト、その隣に日付切替用のボタンが表示される
- その下にシアターのグリッドが表示される
シアターの日別の予約状況の表示イメージ
初期表示時は、各セルに対するレコードは登録されていないため、どのセルも「未登録」として表示されます。
画面左上の「シアター」「日付」の部分を切り替えることで、その下のグリッド部分の表示が切り替わるような画面が表示されます。
補足
ここでは、シアターの他に「日付」で切り替えて表示するような例ですが、日付以外に「フィールドの選択肢」や「他アプリのレコード」を元に切り替えるといったことも可能です。また、日付で切り替えせずに「シアター」のみを条件としてグリッド表示を切り替えるということも可能です。
詳細はグリッド表示モードの操作マニュアルの「サブキーの定義」を参照ください。
座席予約の際は、対象のセルを範囲選択して「編集」ボタンをクリック後、予約者の情報を入れることで一括更新することができます。例えば、G-3からI-3をまとめて更新した場合は、次のようになります。（グリッド定義で「入力不可」としたマス目（セル）を選択しても、一括更新処理はされません。）
座席予約後の表示イメージ
各セル毎に1レコードで登録されるので、3席分まとめて登録した場合、レコードは3レコード分作成されます。
kGridとkintoneレコードの対応イメージ
このように、kintoneの一覧画面で管理しようとすると難しいような予約管理も、kGridを利用することで座席レイアウトを見ながらの確認や一括登録するようなことを実現できます。
まとめ
kGridのグリッド定義モードとグリッド表示モードの違いについて、図を用いてわかりやすく解説しました。kGridを利用するにあたっての事前準備（縦横のマス目の定義）をするのが「グリッド定義モード」で、マス目を利用した表示や一括編集が行える画面を表示するのが「グリッド表示モード」です。
本記事がkGrid設定時の参考になれば幸いです。その他のkGridを使った活用例はこちらをご確認ください。
グリッド定義モードの操作マニュアル
グリッド表示モードの操作マニュアル
また、kGridを使ったアプリの公開デモ環境も用意しています。メールアドレスの登録不要ですぐにお試しいただけますので、トライアルの前に触ってみたい場合は、デモ環境にてお試しください。
