スクリーン・バリューを極めたいか？入力フォームでユーザーの手間を激減させよう（前半）【ノーコード・ツールGlide】

ユーザーさんが入力画面で快適に入力できようにするには、小さな積み重ねが大切です😄。

例えば、入力フォームである選択項目でカテゴリーを選んだら、次の選択項目では、そのサブカテゴリ―に当たる選択肢だけが表示される。これだって立派な改善ですね。

今日はその方法を学びます。その実装のカギとなるのは、前回に引き続いて「Screen Values」です！「画面が一時的に保持する値」ですね。これを利用してリストのフィルタリングを一層使いやすいものにしよう、というわけです！😆

では、行ってみよ～😄。

Glideで授業の履修申請ができる

なにはともあれ、どんなことを実現したいか確認しますよ！

今回、サンプルとして使うアプリは、「履修申請アプリ」です。受講したい授業を選択して送信します（だいぶ懐かしいです😅）。こんなこともできるんですね。

ユーザー（学生）が事前にユーザーテーブルに登録されています。あるユーザーがメールでログインすると、次のようにユーザープロフィールが現れます。

で、履修申請ボタンには、アクションとして、Show Formが設定されていますので、履修登録フォーム画面に移動します。ここまでOK!?😊

はい、ここまで淡々と説明しました。が、これだけのことを行うのに、それなりにGlideを使い慣れていないといけませんね。

Public with email、ユーザープロフィール、Row Ownersの各種設定が必要となります。今回のテーマではないので、詳しく解説しませんが、上の説明を読んでフムフムと理解できる皆さまは、過去記事もいっぱい読んでくれたんですね！きっと（まだの方は、ぜひぜひ過去記事もご参照ください😆）。

はい、以上がトップ画面の設定です。

入力済みの値を使って選択肢を絞り込め

では、「履修登録フォーム」を見てみましょう。入力するのは、２つだけです。「教科」と「科目」です。科目は、一つの教科に属しています。

教科・科目選択に使用しているコンポーネントは、おなじみチョイスコンポーネント。

教科を選択すると、その教科に属する科目だけが、科目選択メニューにあらわれます。

もし、この機能がなかったら？そう、全科目の中から科目選択を行わないといけませんね～。理科を教科として選んだのに、科目の選択肢に「古典」とか現れたら、ちょっとイラっとしますね😅。

はい、以上が、今回実現したい機能の概要でした～！

データあってのアプリです

次はデータです。なかなかアプリの設定の説明に入れないのは、いつものととです。データあってのアプリですから、しばしお付き合いください😊！

テーブルは次の４つです。意外に多いね！？

さくっと、眺めていきましょう。一つ目は、ユーザーテーブル。

うん、いつもの「氏名」「メール」「プロフィール画像」の列だけあります。カラム形式がすべて違うことや、メールカラムにRow Ownersの設定がされていることを確認できればOKです。

2つ目は、教科の選択肢専用テーブル。選択肢だけでテーブル一つ作っちゃるというのが、Glideのお作法です。

そして、3つ目は、科目のテーブルです。

注目してほしいのは、科目名に加えて、上位カテゴリーの「教科」のカラムがあることです。一つの教科に３～４の科目が属していることが分かりますね。

そして、最後に「履修」テーブルです。

ユーザーさんが科目を選んで送信した値がここに格納されます。

テーブルの確認って退屈ですか😅。分かりますよ～。眠そうな顔したでしょ！

テーブルの性質が異なる

では、ちょっと補足させてください。テーブルに関する豆知識です！

「ユーザー」「科目」と「履修」のテーブルは、性質が異なります。

「ユーザー」「科目」テーブルは、主にデータ参照されて、行追加される機会は多くありません。このようなテーブルは、よくマスタテーブルと言われます。

一方で、「履修」のテーブルは、「ユーザー」「科目」などほかのテーブルの値を参照して、頻繁に行が増えていきます。このようなテーブルは、「トランザクショナルテーブル」と言われます。

まあ、テーブルの分類の仕方はいろいろあるし、説明の仕方はいろいろあるし、なのですが、頭の片隅にいれておきましょう。テーブルの学習からは逃れられませんからね。ノーコード・ツールであっても。

次回は、アプリ上で選択肢のフィルタリングの設定をしますでのお楽しみに～😆

まとめ

今回の企画では、Screen Valuesを使って、入力フォームである選択項目でカテゴリーを選んだら、次の選択項目では、そのサブカテゴリ―に当たる選択肢だけが表示される機能を実装します。今回は、作業目標とテーブルの解説をしました。次回が本題ですよ～😆。

では、ビーダゼーン！

※私のやる気アップとブログの品質向上につながりますので、記事が気に入られた方は、「ポチっ」と好きボタンを押してくださったり、フォローいただけますと幸いです🙇。

なお、私が運営しているYouTubeチャンネル「ノーコード・ツール解説チャンネル」に掲載している動画を補足したり、発展させる形でnote記事を書いて、「Glideって何ですか？」というマガジンに集約しております！