Power Apps ギャラリーのフィルター はAND、ORを使おう(IF文ネストは増えると大変)

★2024/2月 更新 YouTubeへサンプル動画をアップしました!

YouTube「ヨウセイTube」チャンネルを立ち上げたので、本記事の実装の説明動画をアップしました。
記事を合わせてご参考ください~!

はじめに

Power Appsのキャンバスアプリのギャラリーなどに表示するデータをドロップダウンや日付などで複合的にフィルターをしたい場合はAND、ORのフィルターの書き方を使えば数行で実装が出来ます。
IF文でたくさん条件を切り分けて記載すると可読性、保守性の問題があるので複数の項目でフィルターする実装の場合は特にAND、ORのFilter構文で実装するのが良いと思います。
※かくいう自分も2年半前にドラーニさんの動画を見るまではこの実装を知らず試行錯誤していました。

最近だと上記の書き方については有識者の方のブログでも見かけるようになったので、あえて書く必要もないんですが、多い方が見つけやすくなるかと思い今回投稿しています。
また、今回はSPOリスト上での実装を前提に記載しています。(FilterのInやSearchは委任対象外なのでいったん避けてStartsWithで前方一致検索の実装)

ぴーたくん

ギャラリーのフィルターの書き方はみんな躓くポイントだねー。

複合的なフィルターサンプル

複合的な検索フィルターをAND,ORで一度のFilterで記載

AND、ORのフィルターの書き方

書き方の例としては以下の感じです。カンマがANDで || がORになります。
また、AND()、OR()で囲む書き方もあります。どちらも同じ結果となります。どちらかで統一すれば見やすいかと思います。

サンプル項目の指定が空の場合はフィルターなし、値ありが複数項目ある場合の例
Filter(<データソース>,
  項目1の指定が空 || 項目1が指定の値
 ,項目2の指定が空 || 項目2が指定の値,
・・・)

ANDとORの書き方で以下でも同じ結果となる
Filter(<データソース>,
 AND(
  OR( 項目1の指定が空 , 項目1が指定の値 )
   , OR(項目2の指定が空 , 項目2が指定の値)
  ,・・・))

TIPS・カンマ区切りで式をAND条件でつなげれる。すべての条件がTRUEとなるデータが返ってくる。
・式の結果がTRUEとなる場合(特定のコントロールが空→TRUEなど)はすべてのデータが対象となる。
・||またはOR()でいずれかの場合にTRUEという書き方が出来る。
・ANDはいずれもTRUEだったらTRUE、ORはいずれかがTRUEならTRUEになる。

公式の構文は以下です。ANDのことは書いてますが、OR( ||)のことはあまり明文化されていないですかね。一応文中にAND,ORで複合的な検索しているサンプルはありました。
Power Apps の Filter、Search、LookUp 関数 (動画を含む) – Power Platform | Microsoft Learn

シンプルな実装サンプル

上記だとちょっとわかりずらいので以降簡単なサンプルを作って実装例を掲載します。

サンプル・フィルター対象
①区分(社員、BP、個人)をDropdownKubunで指定する

・ギャラリーのItems
Filter(人材スキルリスト,
IsBlank(DropdownKubun.Selected) || 区分.Value =DropdownKubun.Selected.Value
)

最初の条件でドロップダウンの選択が空ならTRUEとなります。
OR条件はいずれかがTRUEであれば結果はTRUEとなるので、条件がTRUEとなるレコード
→すべてのレコードとなり、フィルターなしですべて返却されるとなります。
ドロップダウンが空ではない場合、最初のはFALSEになり、次のドロップダウンの指定値が一致するレコードがTRUEとなり返されるという動きになります。

ドロップダウンに値を指定すると以下のように指定のレコードだけが返されます。


これで空の場合と指定がある場合をIF文で切り替える記載でなく1文で書けました。非常にスマートですね!
続いて複数の項目を条件に追加してみます。

複数項目の複合フィルターサンプル

以下の項目を一気に増やして実装しています。いずれも空の場合はその項目はフィルターなしとなる動作です。
以下のように行を分けても6行くらいで書けます。もっと項目が増えても問題ない範囲ですね。
また、サンプルではテキスト入力はStartsWithで前方一致し、入力がある場合は氏名またはメールどちらかが一致するものとしています。このように一つの入力コントロールで複数項目への検索も可能です。

  1. 区分(ドロップダウン) →社員、BP,個人
  2. 期間開始(日付コントロール) →指定日付より開始時期が後のものがTRUE
  3. 期間終了(日付コントロール) →指定日付より開始時期が前のものがTRUE
  4. 名前またはメール(テキスト入力) →氏名またはメールに対して前方一致するものがTRUE

CodeFilter(
人材スキルリスト,
IsBlank(DropdownKubun.Selected) || 区分.Value = DropdownKubun.Selected.Value,
IsBlank(DatePickerStart.SelectedDate) || 開始時期 >= DatePickerStart.SelectedDate,
IsBlank(DatePickerEnd.SelectedDate) || 開始時期 <= DatePickerEnd.SelectedDate,
IsBlank(TextInputNameORMail.Text) || StartsWith(氏名,TextInputNameORMail.Text) || StartsWith(メールアドレス,TextInputNameORMail.Text)
)

NOTEやったことがある人はわかるかと思いますが、IF文で分岐してネストして書いている場合はこの段階4,5個くらいですでに実装がえらいことになっています。10行が20行、40行、80行、160行と倍々ゲームです。なのでこんなのやりたくないと思っちゃいます。(サンプル書くのもキツイので割愛)

複合的な検索フィルターをAND,ORで一度のFilterで記載

日付でフィルター

まずは開始日が StartとEndの日付コントロールの範囲のものでフィルターしてみます。
この際にEndが指定なしの場合はStartのフィルターのみが有効で逆もしかりです。どちらも指定すればその範囲の日付のデータが返却されます。また以下の例だと開始日がそもそも空のデータは除外されています。

期間開始を指定

追加で期間終了を指定

区分でフィルター(ドロップダウン)

上記に加えて区分を指定します。どちらにも一致するレコードが返されます。

日付に追加で区分を指定(個人)

日付に追加で区分を指定(社員)

テキスト入力でフィルター(複数列を前方一致)

上記に加えて、名前、アドレスに任意の値を入れます。
この例では氏名とメールアドレスいずれかに前方一致するものとしています。

加えて、「エヌ」で検索 →氏名、またはメールに前方一致が対象

加えて、「nsurf」で検索 →氏名、またはメールに前方一致が対象

上記のように複合的に指定した条件に一致したレコードを表示することが出来ます。
テキスト入力以外をクリアした場合はこの部分だけ有効なフィルターとなります。

他をクリアして「nsurf」で検索 →氏名、またはメールに前方一致が対象

ぱわ代

検索対象の項目がいっぱいあっても1行ずつ追加するくらいで実装できるのね!とてもスマートだわ!

サンプルアプリでの例

以前自社で開発した人材スキル管理アプリでは、上記よりさらに複合的な内容のフィルター実装をしています。
このアプリではさらに柔軟な検索として、複数コンボボックスの値が複数選択肢に含まれるものという、テーブル対テーブルの含む検索も取り入れているため、委任警告を無視できる2000件までのデータを前提に実装しています。この実装ではデータソースがDataverseでも委任警告が出るので、やるなら警告無視ORコレクション化しての対応となります。

ドロップダウン以外にもコンボボックスで複数値(C#、Javaなど)が言語のいずれかに含むという検索も実装している。

テキスト検索では、含む検索で、氏名、所属、最寄り、勤務先のいずれかに一致すれば対象としている。かつ、対象の場合はその項目を色付け

SPOでもデータがデータ行制限の上限2000行以下となる場合や、そうなるようにフィルターしたデータのみ表示する前提であれば、SearchやFilterのInで部分一致検索も警告を無視して実装可能です。いったんコレクションに入れとけば警告自体も出ません。(上限2000件は同じ)
データ量やアプリで表示する件数や要件次第でどういう風に実装するかは調整されるとよいかと思います。

ただ以下のようにデータソース直接の場合といったん保持する場合とではギャラリーの挙動が異なるのがポイントです。ギャラリーのAllItemsをCountRowしてみると違いが分かりやすいです。

NOTE委任警告なしでFilterでデータソースから直接ギャラリーに指定する場合は100件ずつ取ってきて、スクロールすると次の100件を表示する挙動となる。この場合はデータ行制限は関連しない(変数などには入れていないので)
ただし、Filterで委任警告が出ている場合やAddColumnsなどで内容が変わっている場合なども一旦内部的に保持されるので、コレクションに入れていない場合でもデータ行制限の500~2000行までのデータが上限となり一度に取得する挙動となります。

こちらのアプリについて気になる方は自社ブログで以前紹介しています。動画もあるのでご参考ください。
実装の参考用などに欲しい方は自社サービスとして販売も行っています。

おわりに

ということで今回はAND、OR検索を使ってスマートにギャラリーフィルターを実装する方法を書きました。
冒頭で書いた通り、2年半前にドラーニさんの動画を見るまでは、データ行制限以下となる範囲をコレクションに入れての対応やIFをネストするなどの対応したりしてもっといい書き方ないのかとモヤモヤしていました。(当時はそういったサンプルしか出てなかった記憶)この実装を知ったときは衝撃とハッピーが止まりませんでした!

IF文ネストの場合だと項目少なくてシンプルなのは別にいいんですが、検索対象項目が増えるに伴いどんどんと同じような内容の分岐が増えてしまいます。実際に数十項目あるもので3000行くらいのコード書いているアプリを見たこともあります💦可読性、保守性が悪いし作る工数もかかるのでオススメしません。対象項目がひとつ追加されたら、さらに倍増して大変です。FilterのAND、ORの書き方を覚えてスマートに実装しましょうー!

最後にこの辺りご参考になる動画や記事をご紹介しておわります。それでは。

パワ谷さん

いろんな有識者が有益な情報を出してくれていて、情報も進化しているので定期的な情報収集は大事だな

ドラーニさんの動画
2020年12月の動画
How to apply Multiple Filters to Power Apps Gallery: Dates, Ranges & More! 📅🎯 – YouTube

少し前にも近い内容の動画を出している →こちらはAND()、OR()で書いてますね。
(14) How to apply Multiple Filters to Power Apps Gallery: Dates, Ranges & More! 📅🎯 – YouTube

その他参考になる関連記事を勝手にご紹介
MS益森さんの記事 →段階的に説明されていて、SearchやIn区の説明もあります。
Power Apps のギャラリーのフィルターまとめ – Qiita 

こちらの方も最終的にAND,ORにたどり着いたとなっていますね。
Power Apps 最近学んだギャラリーのFilter関数のきれいな書き方|僕のこれまでの書き方とその問題点も一緒に (ippu-biz.com)

ギャラリー関連記事

ギャラリー関連記事:

自動生成アプリ関連:

この記事は役に立ちましたか?

もし参考になりましたら、下記のボタンで教えてください。

ヨウセイ

ヨウセイ

一般職からSharePoint、C#、.NET系技術者へ、そこからPower App、Power Automate技術者へと転身。 ワンランク上のおっさんはPower Appsでシステム開発が出来る〜! qiitaや自社HPでも技術ブログを書いていました。

関連記事

コメント

この記事へのコメントはありません。

CONTENTS