【Adalo】Airtableのデータを読み込んだ時のfilter、sortの設定について
(構成)
第1回:AdaloからAirtableのデータを取得(Read)
第2回:AdaloからAirtableにデータを追加(Create)
第3回:AdaloからAirtableのデータを更新(Update)
第4回:AdaloからAirtableのデータを削除(Delete)
第5回:AirtableのデータをAdaloで読み込んだ時のfilter、sort設定※本編
(なぜこれを書いたか)
私はAdaloの外部データベースとしてAirtableを使っています。初めて使ったとき、読み込んだデータにフィルターやソートをかけようと思ったのですが、出来ませんでした。いつものAdaloのメニューと違った表示が出て、やり方が分からなかったのです。
AirtableのデータをAdaloで読み込んでフィルターやソートをかける場合はAdaloのやり方ではなくてAirtableのやり方で設定を行うという事が後で分かりました。(Adalo Resourcesにはちゃんと書いてあった。)ちょっと分かりづらい部分があったので自分の備忘録もかねて要点をまとめました。
1.Airtableでデータベースを作る
以下のような「海外旅行」というテーブル(データベース)を作りました。これを使って以下説明していきます。
「company(旅行社)」、「tourName(ツアー名)」、「cost(費用)」の3つの項目があります。
Airtableでは列の見出し部分を「field name」と呼んでいます。filterをかけるときにこの名前は良く出てきますので覚えておいて下さい。(この例では「company」、「tourName」、「cost」がfield nameになります)
(余談)
「何で日本語でデータベースを作らないんだ!」というご不満もあろうかと思います。Adaloの入力で日本語が文字化けするのでいつもは日本語をメモ帳で作ってコピーペーストしているのですが今回はその回数が頻繁なので面倒なのですべて英字で統一しています。(ちょっとした変更、誤字も英字なら文字化けせず、気兼ねなく直せます)
2.AdaloでAirtableのデータを読み込む
以下はAirtableの「海外旅行」というデータベースをAdaloで読み込んだところです。(データの読み込みの方法は以前のブログで説明しています。)
プレビューで表示すると以下のようにすべてのデータが表示されます。これも謎ですが、airtableからデータを読み込むとデータの並びがバラバラになってしまいます。(元データはA,B,C,D・・・と順番に並んでいました)
以下でfilterを使って条件に合うデータのみを表示してみます。
3.filterの設定を行う
カスタムリストを選択して画面左のFiltersをクリックすると、いつもは出てこない「Query Parameter」という項目が出てきます。NameとValueという欄に設定項目を入力します。
4.ハワイのデータだけを表示する
例:「ツアー名(tourName)」が「ハワイ(Hawaii)」のデータだけ抽出
(間違った設定)
NameとValueを以下のように設定したのですがうまく行きませんでした。
Name:tourName
Value:Hawaii
(正しい設定)
何度やってもダメだったのでAdalo Resourcesを見たら設定の方法が説明されていました。Adaloのやり方ではなくairTableのやり方で設定を行うようです。これは絶対考えても分からないやり方でした。
Name:filterByFormula
Value:({tourName}='Hawaii')
この設定を行ってプレビューするとハワイのデータだけが表示されるようになりました。
5.Adalo Resourcesをよく読む
Adalo Resourcesの以下の部分にairtableから読み込んだデータのfilterのかけ方が説明されています。これを最初に読んで理解してからでないとフィルターもソートも使えません。
①Adaloの説明ページ
Filtering Airtable Lists(airTableデータのフィルタ―のかけ方)
②airTableの説明ページ
any formula supported by airtable
6.filterの設定方法
airTableのフィルタ―の設定は以下のような決まりがあります。
①Query parameterのName部分はいつでもfilterByFormulaとする
②( )の中に式や引数を入れる
・・・関数や演算式、論理演算式には( )が付いており、( )の中に式や引数を入れます。(例:AND( )、OR( ))
③field name(データベースの列の見出し部分)は{ }で囲む
④文字列部分は' '(シングルクォーテーション)で囲む
(※数字の場合は囲まない)
(例題)
1.ツアー名(tourName)がハワイ(Hawaii)を抜き出す
Name:filterByFormula
Value:({tourName}='Hawaii')
→式は必ず( )で囲みます。ただ、関数や論理演算式が無いものは( )が無くても動きます。
2.ツアー名(tourName)がハワイ(Hawaii)でないものを抜き出す
論理式 NOT( )を使います。( )の中に式を入れます。
Name:filterByFormula
Value:NOT({tourName}='Hawaii')
3.ツアー名(tourName)が「ハワイ」か「ローマ(Rome)」を抜き出す
論理式OR( )を使います。( )の中に式を入れます。
Name:filterByFormula
Value:OR({tourName}='Hawaii' , {tourName}='Rome')
4.ツアー名が「ハワイ」で、費用(cost)が18万円未満のものを探します
論理式AND( )を使います。( )の中に式を入れます。
Name:filterByFormula
Value:AND({tourName}='Hawaii' , {cost}<18)
※条件が3つ必要な場合は( )の中に式を3個記入します。
その他、様々な論理式、関数がairTableに用意されているので自分が使いたい式をairTableの説明書から探して設定を理解した上で使ってみて下さい。
7.filterを変数で設定する
上記6.で説明したfilterの設定のやり方はAdaloの設定画面を開かないと出来ないのでアプリのユーザーが任意の設定で絞り込みをすることが出来ません。そこで変数を使って任意のデータを入力できるようにしてみます。
(例題)
ツアー名(tourName)がパリ(Paris)のデータだけ絞り込んでみます。
(やり方)
DropDownでツアー名が選択できるようにします。AdaloにDropDownのツアー名選択肢のデータベースを作ります。
以下では「sample」というデータベースを作り、「tourName」(ツアー名)というプロパティを作りました。ここに旅行の行先(ツアー名)を登録します。
「sample」データベースの中身。tourNameというプロパティ(列)に行先のデータを入れた。
(Filterの設定)
マジックテキストを使って上記で作成したDBのプロパティ名を変数として持って来ます。
Name:filterByFormula
Value:OR{tourName}='(sample tourName)'}
※(sample tourName)が変数です。
sample:「データベースの名前」
tourName:「フィールド名」
~動作確認~
DropDownで「パリ(Paris)」を選択し、Parisだけを表示します。
パリ(Paris)だけが表示されるようになりました。
上記は変数を1つ使った単純な例ですが、ANDやORを設定する場合はフィールド名が複数必要になるのでその個数分DropDownを作成して変数で選択できるようにして下さい。
8.ソートの設定
airTableから読み込んだデータをソートする場合、「ソート」という項目は表示されていません。一瞬焦りますが、Adalo Resourcesを見るとFilterの設定を使ってソートが出来ると書かれています。
(Adaloの参考資料)
Sorting Airtable Lists
(設定する項目)
①ソートをするfield(列)を設定(どの列でソートをかけるか?)
Name:sort[0][field]
Value: (ソートをかける列の名前)
②データの並び順(昇順、降順)
Name:sort[0][direction]
Value: asc(またはdesc)
※昇順:asc (ascendの略)
降順:desc (descendの略)
例題:
airTableから読み込んだ「海外旅行」データで、旅行社(A,B,C,D・・・)の列の順番がバラバラなのでここを降順にソートしてみます。
まず、どの列(field)でソートをかけるか設定する。(1つ目の設定)
次にソートの並び順(昇順か降順か)(2つ目の設定)
※以下の例では「降順」(desc)にしています
旅行社名が降順にソートされました。(下図)
今回はairTableのfilterのさわり部分だけを書きました。とても全部は紹介できないですが、一番重要なのはairTableのルール(Formula)に沿って設定を行うという事です。これは考えても分からないので、Adalo ResourcesやairTableの解説をよく読まないとだめだという事です。
(構成)
第1回:AdaloからairTableのデータを取得(Read)
第2回:AdaloからAirTableにデータを追加(Create)
第3回:AdaloからAirTableのデータを更新(Update)
第4回:AdaloからAirTableのデータを削除(Delete)
第5回:airTableから読み込んだデータにfilter、sortをかける※本編
(過去の投稿はこちら)
https://note.com/mucho3/n/n632515d056d1