cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Advocate V
Advocate V

Using Toggle in a Gallery - and only 1 or 0 can be "ON"

I am building a gallery and want to have a toggle in the gallery for each item. I think I already know that when the toggle is flipped, I'll need to use a PATCH() function to actually update my database. That seems like it will be easy enough.

 

However, I need it to also turn off any other items in the gallery. In other words, only one item can be on. Zero can be on as well if they manually turn the one that is "on" to "off" but if one is on, and they turn another one on, it needs to turn the other one that is on to off.

 

These are quotes, and will usually be 5 or less showing in the gallery, but only one quote can be active. So in the image below, if I turn on the first one, that is fine as they are all off. But if I then turn on the 2nd one, it needs to turn off the first? Make sense?

(don't judge my gallery - still building and it looks horrible right now!)
20191120 16_45_57-Item Development - Saved (Unpublished) - PowerApps and 3 more pages - Work - Mic.png

1 ACCEPTED SOLUTION

Accepted Solutions

@EdHansberry 

I have tested my solution now.  There were a few syntax errors but the major change you must make is put this code within the OnSelect property of your toggle instead of OnChange.

 

 

Set(myActiveToggleID,ThisItem.ID);
ClearCollect(myGalleryIDs,ShowColumns(Gallery1.AllItems,"ID"));
ForAll(
    myGalleryIDs,
    Patch(
        your_datasource_name,
        LookUp(your_datasource_name,ID=myGalleryIDs[@ID]),
        {toggle_field_name: If(myGalleryIDs[@ID]=myActiveToggleID,true,false)}
    )
);
Refresh(your_datasource_name);

 

 

I think you will understand why using the OnSelect property instead solves the looping problem but if you would like an explanation please let me know.

 

---
Please click "Accept as Solution" if my post answered your question so that others may find it more quickly. If you found this post helpful consider giving it a "Thumbs Up."

View solution in original post

12 REPLIES 12
Super User
Super User

@EdHansberry this video may help? 

https://www.youtube.com/watch?v=okF03QzP-KM

 

Skip to the 33min mark where they talk about editing inside a gallery. I've used some of these tips before.

Super User II
Super User II

So this is how I did it. 

 

I have a variable that is set at the OnVisible property of the screen as follows: 

Set(defaultgalleryvar, true)

 

I have the DisplayMode property of the radio button set to: 

If(defaultgalleryvar, DisplayMode.Edit, If(ThisItem.IsSelected, DisplayMode.Edit, DisplayMode.Disabled))

 

I have the OnChange property of the radio button set to: 

Set(defaultgalleryvar, false)

 

This is the behaviour I get: 

Radio2.gif

 

It is not the perfect solution by any stretch but should give you an idea as to how to get it done. Let me know if this doesn't help and I can give you better examples. 

 

---
If you like this reply, please give kudos. And if this solves your problem, please accept this reply as the solution. Thanks!

Hardit Bhatia
https://www.thepoweraddict.com

 

One thing my example doesn't do is turn the others OFF, it just disables them but that can be achieved as well. I will post another example soon.
Super User III
Super User III

@EdHansberry 

My idea is to put this code in the OnChange property of each toggle.  When a toggle is click the current record ID is stored in a variable.  Then we collect all the Gallery IDs and loop over them one by one PATCHing them all false except for the current record.  Finally we refresh the datasource so the gallery displays updated info.

 

Set(myActiveToggleID,ThisItem.ID);
ClearCollect(myGalleryIDs,ShowColumns(Gallery1.AllItems,"ID"));
ForAll(
    myGalleryIDs,
    Patch(
        your_datasource_name,
        LookUp(your_datasource_name,ID=myGalleryIDs[@ID])
        {toggle_field_name: If(myGalleryIDs[@ID]=myActiveToggleID,true,false}
    )
);
Refresh(your_datasource_name);

 

I may not have a chance to test this until morning but I thought I'd supply the code in case it works.

 

---
Please click "Accept as Solution" if my post answered your question so that others may find it more quickly. If you found this post helpful consider giving it a "Thumbs Up."

@mdevaney , this almost works. Almost.

 

Here is my code. I used a context variable because this is good only for this screen and didn't see a need to set one globally, but otherwise it is pretty much your code with my names:

 

 

UpdateContext({varActiveQuoteToggleID: ThisItem.UID});
ClearCollect(
    colQuoteChosenUID,
    ShowColumns(
        galBrowseQuotes.AllItems,
        "UID"
    )
);
ForAll(
    colQuoteChosenUID,
    Patch(
        '[dbo].[tblAppItemDevelopmentQuotes]',
        LookUp(
            '[dbo].[tblAppItemDevelopmentQuotes]',
            UID = colQuoteChosenUID[@UID]
        ),
        {
            QuoteChosen: If(
                colQuoteChosenUID[@UID] = varActiveQuoteToggleID,
                true,
                false
            )
        }
    )
);
Refresh('[dbo].[tblAppItemDevelopmentQuotes]')

 

 

So in the database it is working. I have 3 set up right now. When I select one, it does turn the others off. However, visually, they all turn themselves off once the patch operation runs. I set the Default property to ThisItem.QuoteChosen, but that then causes the one that is visually off, to turn on, and the patch gets in a loop! I removed the REFRESH() and that didn't fix it, nor did it cause problems. Not sure that is needed.

I set the Default property back to false to keep the app from running all night. Any ideas? If I can just get the toggle to show the values after one has been clicked and not trigger infinite OnChange events, I'd be good.

 

Because they all show as "off" I cannot test the ability to have them all off as of yet.

 

I'm kinda new to PowerApps. What is the [@UID] doing? I've seen the brackets and @ sign in dropdowns but have never seen documentation on it. Searching for brackets and @ signs in help doesn't return much for me.

@Eelman - thanks for the video. Good videos are always welcome. I've bookmarked to watch later tonight or in the morning.

@EdHansberry 

I have tested my solution now.  There were a few syntax errors but the major change you must make is put this code within the OnSelect property of your toggle instead of OnChange.

 

 

Set(myActiveToggleID,ThisItem.ID);
ClearCollect(myGalleryIDs,ShowColumns(Gallery1.AllItems,"ID"));
ForAll(
    myGalleryIDs,
    Patch(
        your_datasource_name,
        LookUp(your_datasource_name,ID=myGalleryIDs[@ID]),
        {toggle_field_name: If(myGalleryIDs[@ID]=myActiveToggleID,true,false)}
    )
);
Refresh(your_datasource_name);

 

 

I think you will understand why using the OnSelect property instead solves the looping problem but if you would like an explanation please let me know.

 

---
Please click "Accept as Solution" if my post answered your question so that others may find it more quickly. If you found this post helpful consider giving it a "Thumbs Up."

View solution in original post

@PowerAddict what did you use to create that small video? I'm keen to develop small clips like this for my Org Apps.

 

Cheers

Hi @Eelman 

 

Glad you liked it! Its a very simple GIF creator with some cool features like controlling what part of the screen gets recorded, checking each frame before saving the GIF, deleting any unwanted frames, pausing while recording and so on. 

 

Here is the link: https://www.screentogif.com/

 

You can either install it or just run the executable. Either way works great. 

 

Hopefully it helps you with your work!

 

Thanks,

Hardit Bhatia

https://thepoweraddict.com

Helpful resources

Announcements
New Badges

New Solution Badges!

Check out our new profile badges recognizing authored solutions!

New Power Super Users

Congratulations!

We are excited to announce the Power Apps Super Users!

Power Apps Community Call

Power Apps Community Call: February

Did you miss the call? Check out the Power Apps Community Call here.

Microsoft Ignite

Microsoft Ignite

Join digitally, March 2–4, 2021 to explore new tech that's ready to implement. Experience the keynote in mixed reality through AltspaceVR!

Top Solution Authors
Top Kudoed Authors
Users online (29,341)