cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
SMay
Frequent Visitor

Filter gallery based on multiple buttons

Hi folks,

 

First, I'm aware that there are a lot of other posts on this particular topic, but I've looked at pretty much all of the ones I could find and am not coming up with a solid solution for my particular scenario. I'm still learning PowerApps, so much of this is still new to me. 🙂 In any case, here's what I've got:

 

My app consists of 5 different galleries pointing to a single SharePoint list. This SP list consists of a list of "tasks", and each of those tasks has a "stage" associated with it (1 through 5). Each of my 5 galleries is currently designed to list out the tasks belonging to a specific stage using a simple filter, such as the one below:

 

 

 

Filter(
    'Blueprint Use Case Notes',
    Stage = 1
)

 

 

Each particular task has additional data associated with it via a list column, such as the product line associated with it , the type of security controls being applied as a part of that task, general tags, and so on. FWIW, each of these particular columns are Choice types.

 

My goal here is to retain the core filtering applied to each gallery so that it only displays the pre-determined stage's tasks, but I also want to be able to add buttons to the app that will allow users to quickly filter the list shown by all 5 galleries based on the other columns I mentioned above (and perhaps others in the future). From what I can gather, there are basically two ways of doing this: filtering using the OnSelect option of the button via UpdateContext(), or filtering via the Items section of the gallery. I've found lots of posts about the latter that seem like they'd almost get me there, but I'm never able to default back to the basic filtering via stage. I recently found posts about the former, but I'm struggling to understand the full logic of it as it pertains to my scenario.

 

As of late I've been setting a variable on button press and toggling between the two values in order to then reference this value when doing my conditional searching because it seemed like it might be easier to interact with...

 

 

If(varPAM = 0,Set(varPAM, 1),Set(varPAM,0))

 

 

 as opposed to using UpdateContext based on some of the initial posts I came across:

 

 

UpdateContext({varPAM: !varPAM})

 

 

 In either case though, the closest I could get to a working formula for the gallery Items was the following:

 

 

If(
    varPAM = 1,
    Filter(
        'Blueprint Use Case Notes',
        "PAM" in 'Product Line'.Value && 1 in Stage
    ),
    Filter(
        'Blueprint Use Case Notes',
        1 in Stage
    )
)

 

 

However, I'm struggling to understand where I can inject references to the additional buttons without making a giant mess. As I understand it, IF statements within a Filter statement aren't supported (although perhaps they are in a roundabout way, but I'm not able to massage the code I've seen on the subject in a way that works for me). Using an IF statement seems like it would be really handy in this situation, but I imagine there's an easier way to do it.

 

In case it matters, I have one final restriction that I'll mention. When a user clicks on an item in a given gallery, they're taken to a Detail screen with information about that task. When the user goes back to the gallery screen, I'd like their previous selections to remain and not be cleared. That seems to present somewhat of an issue if I wanted to set variables via the OnVisible section of my BrowseScreen, because when I do that it clears the user's selection, which would force them to reselect those options again. No fun.

 

Hopefully that's enough context. If not, I'll respond to any questions as soon as I see them. Thanks in advance!

2 ACCEPTED SOLUTIONS

Accepted Solutions
RandyHayes
Super User
Super User

@SMay 

In general you can do this quite easily by looking at your controls a little different, and kicking the variables to the curb.

 

Consider a checkbox control rather than a button.  You can style a checkbox control any way you like and can even make it look like a button.  More on that if you need it.

 

Now, let's say you replace the button that you mentioned that has the variable in the OnSelect with this new checkbox control (let's call it chkPAM).  If so, then your formula for the Gallery would be the following:

Filter(
    'Blueprint Use Case Notes',
    (!chkPAM.Value || 'Product Line'.Value = "PAM") && 
    Stage = 1
)

 

Now, to add more to this, you can add the same type of checkbox to the screen and change the formula such as this:

Filter(
    'Blueprint Use Case Notes',
    (!chkPAM.Value || 'Product Line'.Value = "PAM") && 
    (!chkOther.Value || 'OtherColumn'Value = "OTHERVAL") &&
    Stage = 1
)

And so on as needed.

 

So, skip the OnVisible and the variables and all the other "code like" actions (PowerApps is a no-code platform) and this will all work well and simple for you.

 

I hope this is helpful for you.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up below. Solved your problem? - Click on Accept as Solution below. Others seeking the same answers will be happy you did.
Check out my PowerApps Videos too! And, follow me on Twitter @RandyHayes

Really want to show your appreciation? Buy Me A Cup Of Coffee!

View solution in original post

SMay
Frequent Visitor

Alright, I ended up solving my issue in a way that I haven't seen anyone else mention, so I'll go ahead and post it here now that I've got it working. Probably should have posted this follow-up question in another thread, but such is life.

 

 

 

 

If(
    tglProductFilterStyle.Value=false,
        Filter(
        'Blueprint Use Case Notes',
        Stage = "1",
        (!chkProduct1.Value || "Keyword1" in 'Product Line'.Value) &&
        (!chkProduct2.Value || "Keyword2" in 'Product Line'.Value) &&
        (!chkProduct3.Value || "Keyword3" in 'Product Line'.Value)
    ),
    Filter(
        'Blueprint Use Case Notes',
        Stage = "1",  //Important to use a comma here instead of &&
        (chkProduct1.Value && "Keyword1" in 'Product Line'.Value) ||
        (chkProduct2.Value && "Keyword2" in 'Product Line'.Value) ||
        (chkProduct3.Value && "Keyword3" in 'Product Line'.Value)
    )
)

 

 

 

 

This results in being able to still dynamically filter my gallery based on the same checkboxes, as opposed to applying a filter through the use of a button every time I want to update the gallery. It also doesn't require creating and filtering a collection of checkboxes, giving me the flexibility of making separate checkboxes so they can be placed wherever I like, which to me looks much cleaner than a bunch of checkboxes in a gallery list. Of course, I have less than 25 checkboxes so something like that is possible, so it may not work well for everyone if you have way more checkboxes.

 

The keys to getting this to work were two-fold:

1. Putting the stage filter at the beginning so I could use a comma instead of &&. Using an && ended up resulting in the filter ignoring that static filter when I went to use || at the end of each line, although there could be another underlying reason for that (or another solution that I'm not aware of). That was just my observation.

2. Swapping my filter logic from, "If the checkbox doesn't have a value, display items that match this keyword filter, but only if the item is also tagged with any other keywords when the relevant checkbox is checked" to "When an item is analyzed, if both the relevant checkbox is checked AND the item is tagged with the associated keyword, display it."

 

Assuming no checkboxes are already checked, this results in a blank gallery when the toggle button is switched to the "on" state (thereby triggering the use of the OR operator), and each time you turn on a filter, it adds the matching items to the list.

 

In any case, I hope that makes sense, and I hope it helps someone down the road!

View solution in original post

10 REPLIES 10
RandyHayes
Super User
Super User

@SMay 

In general you can do this quite easily by looking at your controls a little different, and kicking the variables to the curb.

 

Consider a checkbox control rather than a button.  You can style a checkbox control any way you like and can even make it look like a button.  More on that if you need it.

 

Now, let's say you replace the button that you mentioned that has the variable in the OnSelect with this new checkbox control (let's call it chkPAM).  If so, then your formula for the Gallery would be the following:

Filter(
    'Blueprint Use Case Notes',
    (!chkPAM.Value || 'Product Line'.Value = "PAM") && 
    Stage = 1
)

 

Now, to add more to this, you can add the same type of checkbox to the screen and change the formula such as this:

Filter(
    'Blueprint Use Case Notes',
    (!chkPAM.Value || 'Product Line'.Value = "PAM") && 
    (!chkOther.Value || 'OtherColumn'Value = "OTHERVAL") &&
    Stage = 1
)

And so on as needed.

 

So, skip the OnVisible and the variables and all the other "code like" actions (PowerApps is a no-code platform) and this will all work well and simple for you.

 

I hope this is helpful for you.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up below. Solved your problem? - Click on Accept as Solution below. Others seeking the same answers will be happy you did.
Check out my PowerApps Videos too! And, follow me on Twitter @RandyHayes

Really want to show your appreciation? Buy Me A Cup Of Coffee!
SMay
Frequent Visitor

Thanks Randy! I'll give it a shot and let you know how I get on. I will likely want to make the checkboxes look like buttons, but as you said, we can do that later.

 

Also, I definitely hear you about Power Apps being a no-code platform, and although I'm not a dev by trade, it's certainly hard to not think like that, especially when I come across other solutions using variables and the like. Just hard to differentiate between the situations where they're the best option vs. someone not pointing out a better solution that doesn't use them. Such is life. 😄

RandyHayes
Super User
Super User

@SMay 

Yes, you can get the checkbox to look pretty much like the button.  In fact, I often use the method of putting a checkbox over top of any control that I want to provide "state" to.  I then make pretty much everything about the checkbox transparent.  To the user it looks like a button, for example, but when they click on it, it is really checking the checkbox.  There are some features of the underlying control that get lost (hover, etc.), but it works pretty well.

 

As for variables - they are HIGHLY overused in so many examples and responses.  Variables have their place, but not every place!  PowerApps is a referential no-code platform, just like Excel.  And, just like in Excel, you would not put a formula in a cell and then try and set a variable to the value that is in the cell, you would simply reference that cell any place that you needed that calculated value - same goes in PowerApps.  However, there are times you need "snapshots" of data - that is the use of a variable.

Technically, your scenario is fairly simple and using a variable would not be out of the question (especially if the limitations of the checkbox over a control are not acceptable.)  IN that case, you would simply change back to the button and put something like this in the OnSelect (assuming you would have deleted the checkbox) :

  UpdateContext({chkPAM: !Coalesce(chkPAM, false)})

Incidentally, with the above, you would actually not even need to change the formula I provided for the Gallery very much...it would still function properly with the variable.  It would change to this:

Filter(
    'Blueprint Use Case Notes',
    (!chkPAM || 'Product Line'.Value = "PAM") && 
    (!chkOther || 'OtherColumn'Value = "OTHERVAL") &&
    Stage = 1
)

 

So, either way you go is fine.  Personally I avoid the variables only because the more you have, the harder it is to troubleshoot issues.  But, this is a minimal use of a variable and would not be very complex from a troubleshooting perspective.

 

By the way, the coalesce in the above formula is all about providing a "Default".  When you first hit this formula, chkPAM will be blank, so the Coalesce returns a false in that case and the function works fine.  After it is set, the Coalesce will return whatever value is in the chkPAM variable.

 

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up below. Solved your problem? - Click on Accept as Solution below. Others seeking the same answers will be happy you did.
Check out my PowerApps Videos too! And, follow me on Twitter @RandyHayes

Really want to show your appreciation? Buy Me A Cup Of Coffee!
SMay
Frequent Visitor

@RandyHayes That worked wonderfully!! Wewt. I had to adjust the syntax a bit to the following (perhaps because of the column types?), but once I figured that out it worked like a charm.

 

Filter(
    'Blueprint Use Case Notes',
    (!chkPAM.Value || "PAM" in 'Product Line'.Value) &&
    (!chkCP.Value || "CP" in 'Product Line'.Value) &&
    1 in Stage
)

 

 

Edit: Never mind - seems you responded while I was writing this. 😄 So, now that we're done w/ the hard part, do you have some quick tips on making the checkbox look more like a button? I played around with it myself but couldn't figure out a straightforward way to do it, and Google isn't really much help it seems. =/

 

Thanks again!

RandyHayes
Super User
Super User

@SMay 

I would reconsider the use of the in operator in your filter though as it is not delegable and in your case the equal operator should suffice.  Perhaps delegation is not an issue for you at this time, but I wouldn't want you to utilize that in all cases as surely you will run into a delegation issue eventually.

 

If PAM and CP are partial strings that might be contained in the choice column, then the in operator is more necessary, but things like the Stage value should be filtered with the = operator instead.

 

Otherwise...glad you are progressing now!!

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up below. Solved your problem? - Click on Accept as Solution below. Others seeking the same answers will be happy you did.
Check out my PowerApps Videos too! And, follow me on Twitter @RandyHayes

Really want to show your appreciation? Buy Me A Cup Of Coffee!
SMay
Frequent Visitor

@RandyHayes 

My list only has 71 rows in it at the moment and should only grow by 3-4 every 6-12 months, so from what I understand that lack of delegability (is that a word? :D) shouldn't be a problem. That said, I appreciate the elaboration on using variables! I don't know if I'll be building any more Power Apps after this one, but I've never ran across a solution like that before so I'm definitely jazzed about having another tool to use if I need it. 🙂

 

I was also able to get my checkbox to work like a button as well, although my solution may have been a bit different than what you had mentioned (if I interpreted what you suggested correctly). Basically I put down a label w/ the text I wanted for the "button", set the BorderColor to

 

If(!chkCP.Value, RGBA(0, 18, 107, 1), RGBA(152, 208, 70, 1))

 

 then put a checkbox over the top of that label and made everything transparent. Seems to work pretty well! I'm not super jazzed about doing that 26 more times for the other buttons I'll need, but copying & pasting isn't too bad. 🙂

 

Thanks again!

RandyHayes
Super User
Super User

@SMay 

Yes, you're on the right track!  You can actually jump into building a component to help solve some of the repetitive copy/paste actions.  A simple component with your label and the checkbox would be pretty easy to pull off.

 

As for the delegation, you just need to remember that the in operator is not going to delegate.  So, you just need to factor that into your design.  If it is important, then there needs to be some level of pre-filtering (that is delegable) in order to apply the non-delegable criteria to the pre filtered items.

 

No problem on the help 🙂 

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up below. Solved your problem? - Click on Accept as Solution below. Others seeking the same answers will be happy you did.
Check out my PowerApps Videos too! And, follow me on Twitter @RandyHayes

Really want to show your appreciation? Buy Me A Cup Of Coffee!
SMay
Frequent Visitor

Hey @RandyHayes,

 

Things have been going quite well with the app, so thanks for all of your help!

 

I had an enhancement request come through from a few people about being able to swap between the operators being used when applying filters (e.g. swapping between AND and OR), but I'm having quite a difficult time figuring out a solution. At first I thought it would be as easy as swapping the && at the end of each string to ||, but when I do that my filter completely ignores the static Stage-based filter and consequently every other checkbox I'm basing my search on. All of the examples I've seen seem to be focused on using an AND operator, so Googling hasn't provided much in the way of a solution either. 😞

 

Here's what I was trying to do, but hopefully you or someone else can point me in the right direction (or make me sad and tell me it's not possible, lol). I'm also going to be looking to add in a free-text search, but I'll work on that some more before I ask any questions about it - just wanted whoever responds to be aware in case it changes the solution:

 

If(
    tglProductFilterStyle.Value=false,
        Filter(
        'Blueprint Use Case Notes',
        Stage = "1" &&
        (!chkProduct1.Value || "Keyword1" in 'Product Line'.Value) &&
        (!chkProduct2.Value || "Keyword2" in 'Product Line'.Value) &&
        (!chkProduct3.Value || "Keyword3" in 'Product Line'.Value)
    ),
    Filter(
        'Blueprint Use Case Notes',
        Stage = "1" &&
        (!chkProduct1.Value || "Keyword1" in 'Product Line'.Value) ||
        (!chkProduct2.Value || "Keyword2" in 'Product Line'.Value) ||
        (!chkProduct3.Value || "Keyword3" in 'Product Line'.Value)
    )
)

 

If it helps, TglProductFilterStyle is a toggle button with a False Value of "AND" and a True Value of "OR".

 

The expected result would be to toggle the button on in order to utilize an OR operator, at which point combining any of the filters would display a list of any of the items matching any of the selected product filters. For example, selecting the Product1 and Product2 checkboxes would display any items tagged with either of those product keywords. Therefore, if an item was tagged with keywords for Product1, Product2, and Product3, it would be displayed. However, an item tagged with just Product3 would not be displayed.

 

Hope that's enough (but not too much) info. 😂 Thanks in advance for any help folks can provide!

 

 

SMay
Frequent Visitor

Alright, I ended up solving my issue in a way that I haven't seen anyone else mention, so I'll go ahead and post it here now that I've got it working. Probably should have posted this follow-up question in another thread, but such is life.

 

 

 

 

If(
    tglProductFilterStyle.Value=false,
        Filter(
        'Blueprint Use Case Notes',
        Stage = "1",
        (!chkProduct1.Value || "Keyword1" in 'Product Line'.Value) &&
        (!chkProduct2.Value || "Keyword2" in 'Product Line'.Value) &&
        (!chkProduct3.Value || "Keyword3" in 'Product Line'.Value)
    ),
    Filter(
        'Blueprint Use Case Notes',
        Stage = "1",  //Important to use a comma here instead of &&
        (chkProduct1.Value && "Keyword1" in 'Product Line'.Value) ||
        (chkProduct2.Value && "Keyword2" in 'Product Line'.Value) ||
        (chkProduct3.Value && "Keyword3" in 'Product Line'.Value)
    )
)

 

 

 

 

This results in being able to still dynamically filter my gallery based on the same checkboxes, as opposed to applying a filter through the use of a button every time I want to update the gallery. It also doesn't require creating and filtering a collection of checkboxes, giving me the flexibility of making separate checkboxes so they can be placed wherever I like, which to me looks much cleaner than a bunch of checkboxes in a gallery list. Of course, I have less than 25 checkboxes so something like that is possible, so it may not work well for everyone if you have way more checkboxes.

 

The keys to getting this to work were two-fold:

1. Putting the stage filter at the beginning so I could use a comma instead of &&. Using an && ended up resulting in the filter ignoring that static filter when I went to use || at the end of each line, although there could be another underlying reason for that (or another solution that I'm not aware of). That was just my observation.

2. Swapping my filter logic from, "If the checkbox doesn't have a value, display items that match this keyword filter, but only if the item is also tagged with any other keywords when the relevant checkbox is checked" to "When an item is analyzed, if both the relevant checkbox is checked AND the item is tagged with the associated keyword, display it."

 

Assuming no checkboxes are already checked, this results in a blank gallery when the toggle button is switched to the "on" state (thereby triggering the use of the OR operator), and each time you turn on a filter, it adds the matching items to the list.

 

In any case, I hope that makes sense, and I hope it helps someone down the road!

Helpful resources

Announcements
2022 Release Wave 1 760x460.png

2022 Release Wave 1 Plan

Power Platform release plan for the 2022 release wave 1 describes all new features releasing from April 2022 through September 2022.

Community Connections 768x460.jpg

Community & How To Videos

Check out the new Power Platform Community Connections gallery!

Top Solution Authors
Top Kudoed Authors
Users online (1,639)