Is there a way to turn off the default click action on a gallery card?

Copper Contributor

I have created a site page that contains a list that filters another table via Connected Web Parts.

 

The filtering list view is a gallery view so that the selections look like buttons.

The problem is if the user clicks anywhere on the tile, except the check circle a new window is opened for the item selected from the filter table.

Is there a way to turn off this aspect of the gallery cards? I just want the user to be able to check the circle and not open the details form for each card.

Thanks for helping.
TJ

2 Replies

@tj7933 

Yes, you can turn off the default click action on a gallery card by using custom code or JSON formatting. Here are a couple of ways to achieve this:

1. Using custom code: You can use the OnSelect property of the gallery card to specify a custom action when the card is clicked. For example, you can set the OnSelect property to "UpdateContext({selectedItem: ThisItem})" to store the selected item in a context variable. Then you can use this variable to perform further actions, such as filtering another table. Here's an example:

 

<Gallery Items="{YourDataSource}" >
<Gallery.ItemTemplate>
<YourCardTemplate OnSelect="UpdateContext({selectedItem: ThisItem})">
<!-- Your card layout here -->
</YourCardTemplate>
</Gallery.ItemTemplate>
</Gallery>

2. Using JSON formatting: You can use the "customCardAction" property of the gallery card to specify a custom action when the card is clicked. Set the "customCardAction" property to false to disable the default click action. Here's an example:

{
"$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
"elmType": "div",
"style": {
"border": "1px solid gray",
"padding": "10px",
"width": "200px"
},
"children": [
{
"elmType": "span",
"txtContent": "Title: ",
"style": {
"font-weight": "bold"
}
},
{
"elmType": "span",
"txtContent": "[$Title]"
}
],
"customCardAction": {
"action": "false"
}
}

With either of these approaches, you can customize the behavior of your gallery cards and disable the default click action.

 

If I have answered your question, please mark your post as Solved
If you like my response, please give it a like

@Deleted It seems option #2 does not stop double clicks. I can't find a way to disable that. Additionally in my Edit View, I've even made sure the Title column is selected and not Title (with link to edit item). Do you know a way to stop double click from opening a new tab to view that item?