You’re offline. This is a read only version of the page.
Hi,
I have a vertical gallery with buttons as one of the field's, So I have multiple buttons with one instance. Now I need to change the color of each button after it is clicked to show which buttons are clicked and which are not.
Thanks.
Hi @MJK ,
Have you taken a try with the solution I provided above? Is it helpful in your scenario?
According to the needs that you mentioned, I think the solution I provided above could achieve your needs. Please consider take a try with it, check if the issue is solved.
If you have solved your problem, please consider go ahead to click "Accept as Solution" to identify this thread has been solved.
Best regards,
Hi @MJK ,
Just checking if you got the result you were looking for on this thread. Happy to help further if not.
Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.
Hi @MJK ,
You need something to store the value in the gallery or you simply cannot control which buttons are to change colour. You can use AddColumns and set the Default to false, Patch true to it when the box is checked and bind the box to the added field.
Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.
Hi @MJK ,
Based on the needs that you mentioned, I think the collection could achieve your needs. You could consider load your data source records into a collection, along with a new column "ButtonOptions" added via the AddColumns function.
On your side, please consider set the OnStart property of App to following:
Share
Report
All responses (
Answers (ClearCollect(
RecordsCollection,
AddColumns(
'Your Data Source',
"ButtonOptions",
""
)
)them use the RecordsCollection as data source in your app instead of your original data source. And bind your Gallery to the RecordsCollection.
Note: The result the AddColumns function returned is a temporary table, which would not make any changes to your underlying data source.
After that, re-load your canvas app (fire the OnStart property of App), then try the solution I provided above, check if the issue is solved.
Best regards,
The Items property of my Gallery is a database table, How do I add an extra column to the Gallery without adding a column to the db table?
Thanks @v-xida-msft for the huge answer to the small question.
@MJK , please let me know if I have over-simplified this.
Hi @MJK ,
Could you please share a bit more about your app's configuration?
Do you add several buttons inside your Gallery?
Based on needs that you mentioned, I think you want to achieve your needs as following screenshot, is it right?
According to the needs that you mentioned, I think there is no direct way to achieve your needs. As an alternative solution, you need to add a additional column in your data source (your Gallery connected to) to store the button click status for each item in your Gallery.
I have made a test on my side, please consider take a try with the following workaround:
My data source structure as below:
Note: The ButtonOptions column is a used to store the button click status for each item in your Galleru.
Add a Gallery in my app screen, set the Items property to above Table data source ("ProductsCollection"). Then add three buttons inside the Gallery, set the Text property of these buttons to "Option1", "Optjion2", "Option3", ... individually.
Set the OnSelect property of the "Option1" button to following:
Patch(
ProductsCollection,
ThisItem,
{
ButtonOptions: ThisItem.ButtonOptions & "Option1;" // Modify formula here for each button
}
)set the Fill property of the "Option1" button to following:
If(
"Option1" in ThisItem.ButtonOptions, // Modify formula here for each button
RGBA( 255, 140, 0, 1 ),
RGBA(56, 96, 178, 1)
)
Set the OnSelect property of the "Option2" button to following:
Patch(
ProductsCollection,
ThisItem,
{
ButtonOptions: ThisItem.ButtonOptions & "Option2;"
}
)
set the Fill property of the "Option2" button to following:
If(
"Option2" in ThisItem.ButtonOptions,
RGBA( 255, 140, 0, 1 ),
RGBA(56, 96, 178, 1)
)
Set the OnSelect property of the "Option3" button to following:
Patch(
ProductsCollection,
ThisItem,
{
ButtonOptions: ThisItem.ButtonOptions & "Option3;"
}
)
set the Fill property of the "Option3" button to following:
If(
"Option3" in ThisItem.ButtonOptions,
RGBA( 255, 140, 0, 1 ),
RGBA(56, 96, 178, 1)
)Please refer to above solution, then try it for your scenario, then check if the issue is solved.
Of course, if you want to unselect button option when you press button again, please consider modify the formula within the OnSelect property of each button in your Gallery as below:
"Option1" OnSelect:
If(
"Option1" in ThisItem.ButtonOptions,
Patch(
ProductsCollection,
ThisItem,
{
ButtonOptions: Substitute(ThisItem.ButtonOptions, "Option1;", "")
}
),
Patch(
ProductsCollection,
ThisItem,
{
ButtonOptions: ThisItem.ButtonOptions & "Option1;"
}
)
)
"Option2" OnSelect:
If(
"Option2" in ThisItem.ButtonOptions,
Patch(
ProductsCollection,
ThisItem,
{
ButtonOptions: Substitute(ThisItem.ButtonOptions, "Option2;", "")
}
),
Patch(
ProductsCollection,
ThisItem,
{
ButtonOptions: ThisItem.ButtonOptions & "Option2;"
}
)
)"Option3" OnSelect:
If(
"Option3" in ThisItem.ButtonOptions,
Patch(
ProductsCollection,
ThisItem,
{
ButtonOptions: Substitute(ThisItem.ButtonOptions, "Option3;", "")
}
),
Patch(
ProductsCollection,
ThisItem,
{
ButtonOptions: ThisItem.ButtonOptions & "Option3;"
}
)
)Please take a try with above solution, check if it could help in your scenario.
Best regards,
Hi @MJK ,
You need to add a column to your gallery of true/false (boolean) type - I will call it BtnClick below.
On the OnSelect of the button, put this
Patch(
ThisItem,
{BtnClick:!BtnClick.Value}
)Then the Colour of the button
If(
ThisItem.BtnClick=true,
YourClickedColor,
YourNormalColor
)
Please click Accept as solution if my post helped you solve your issue. This will help others find it more readily. It also closes the item. If the content was useful in other ways, please consider giving it Thumbs Up.
#1
WarrenBelz
146,745
Most Valuable Professional
#2
RandyHayes
76,287
Super User 2024 Season 1
#3
Pstork1
66,091
Most Valuable Professional
