脱!教養ゼロママ

もう恥ずかしくない!教養のあるママを目指してます!

MENU

フォーム画面のドロップダウンメニュー|初心者のアプリ開発|Adalo

f:id:yuka-edu:20220227162449p:plain

こんにちは!ゆかゆかです。

今日はAdaloのフォームコンポーネントでドロップダウンメニューを出してみます~

 

参考にした英語版の説明はこちらになります!

私も設定を試してみたいと思います。

help.adalo.com

 

 

最終的なイメージ

動物名をドロップダウンメニューで表示させます。

動物名を選択します。

f:id:yuka-edu:20220227145709j:plain

動物名の一覧を選択できます。

f:id:yuka-edu:20220226212940j:image

 

それでは、具体的な設定をしていきます〜

 

データコレクションの関連設定

f:id:yuka-edu:20220226203601p:plain

リンク:Lists of lists を使ってみるよ

 

まずはデータコレクションを用意します。

今回は以前Lists of lists で使用した動物診察のデータを使用します。

 

上のイラストのように診察データとペットデータを用意しました。

後で診察の登録フォームを設定した時に、

ペット名を1つだけ選べるドロップダウンメニューを表示できます。

 

ポイントは診察にはペット情報を1件持てる設定をしている点です。

 

 

Adalo画面設定

「診察」のフォーム画面を用意します。

 

フォームの配置

  1. ADD COMPONENT > Form を選択
  2. 好きな画面に配置

f:id:yuka-edu:20220227153153p:plain

 

データコレクション指定

  1. Which data collection?:対象のデータコレクションを選択

f:id:yuka-edu:20220227153202p:plain

 

フォームの項目設定

  1. Fields にドロップダウン表示させたい項目を選択

f:id:yuka-edu:20220227153211p:plain

 

おしまい

設定は以上になります〜!

データの設定がちゃんとできていれば

フォーム画面を設定した時に自然とドロップダウンメニューになるようです。

 

▼データの関連に自信がない方はこちら

yuka-edu.hatenablog.com

 

 

▼無料でも意外と使える Nocode開発ツール Adalo

www.adalo.com