cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Power Participant
Power Participant

Adaptive card not displaying action button Show Card

For some reason when my flow sends a Adaptive card with only one action show card button it will not display the ShowCard button.

If i add another ShowCard then no problem they are displayed.

 

In the adaptive designer it looks correct.

Adaptive card in designerAdaptive card in designerAdaptive card when sentAdaptive card when sentAdaptive card with 2 ShowCard buttons, sent and workingAdaptive card with 2 ShowCard buttons, sent and working

12 REPLIES 12
Highlighted
Super User
Super User

Re: Adaptive card not displaying action button Show Card

Hi @JimmyWork 

 

Could you please share a screen capture of your flow.this seems like issue in JSON some where.

 

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

Highlighted
Power Participant
Power Participant

Re: Adaptive card not displaying action button Show Card

@DeepakS 

This is the json, again it works if i add another ShowCard or in the adaptive card designer.

But as soon as i send it using email in flow i get the result i posted.

 

 

{
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "type": "AdaptiveCard",
    "version": "1.0",
    "body": [
        {
            "type": "TextBlock",
            "text": "You have been assigned to ticket: T238989392",
            "weight": "Bolder",
            "size": "Medium"
        },
        {
            "type": "ColumnSet",
            "columns": [
                {
                    "type": "Column",
                    "width": "auto",
                    "items": [
                        {
                            "type": "Image",
                            "url": "https://pbs.twimg.com/profile_images/3647943215/d7f12830b3c17a5a9e4afcc370e3a37e_400x400.jpeg",
                            "size": "Small",
                            "style": "Person"
                        }
                    ]
                },
                {
                    "type": "Column",
                    "width": "stretch",
                    "items": [
                        {
                            "type": "TextBlock",
                            "text": "Matt Hidinger",
                            "weight": "Bolder",
                            "wrap": true
                        },
                        {
                            "type": "TextBlock",
                            "spacing": "None",
                            "text": "Assigned {{DATE(2017-02-14T06:08:39Z, SHORT)}}",
                            "isSubtle": true,
                            "wrap": true
                        }
                    ]
                }
            ]
        },
        {
            "type": "TextBlock",
            "text": "The ticket have been placed in your \"My Assigned\"",
            "wrap": true
        },
        {
            "type": "FactSet",
            "facts": [
                {
                    "title": "Title",
                    "value": "title value"
                },
                {
                    "title": "Priority",
                    "value": "priority value"
                },
                {
                    "title": "Case category",
                    "value": "category value"
                },
                {
                    "title": "Case type",
                    "value": "Case value"
                },
                {
                    "title": "Due date:",
                    "value": "Due date value"
                }
            ]
        },
        {
            "type": "ActionSet",
            "actions": [
                {
                    "type": "Action.ShowCard",
                    "title": "Show description",
                    "card": {
                        "type": "AdaptiveCard",
                        "body": [
                            {
                                "type": "TextBlock",
                                "text": "Hello World",
                                "wrap": true
                            }
                        ],
                        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
                    }
                }
            ]
        }
    ]
}

 

Highlighted
Power Participant
Power Participant

Re: Adaptive card not displaying action button Show Card

Now you can replicate the issue by using what Microsoft suggest.
https://adaptivecards.io/explorer/Action.ShowCard.html

 

The ShowCard button will not be displayed, if you do not add another after it, in the designer it will show but not when you send the card

{
	"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
	"type": "AdaptiveCard",
	"version": "1.0",
	"body": [
		{
			"type": "TextBlock",
			"text": "This card's action will show another card"
		}
	],
	"actions": [
		{
			"type": "Action.ShowCard",
			"title": "Action.ShowCard",
			"card": {
				"type": "AdaptiveCard",
				"body": [
					{
						"type": "TextBlock",
						"text": "What do you think?"
					}
				],
				"actions": [
					{
						"type": "Action.Submit",
						"title": "Neat!"
					}
				]
			}
		}
	]
}

 

 

Highlighted
Super User
Super User

Re: Adaptive card not displaying action button Show Card

Hi @JimmyWork 

You need to use following structure in html field when sending adaptive card using send email action:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="application/adaptivecard+json">{
"type": "AdaptiveCard",
"version": "1.2",
"hideOriginalBody": true,
<body tag of adaptive card from adaptive designer>
}
</script>
</head>
<body>
Visit the <a href="https://docs.microsoft.com/outlook/actionable-messages">Outlook Dev Portal</a> to learn more about Actionable Messages.
</body>
</html>

 

Card.png

Here is full html with card:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="application/adaptivecard+json">{
"type": "AdaptiveCard",
"version": "1.2",
"hideOriginalBody": false,
"body": [
{
"type": "TextBlock",
"text": "Publish Adaptive Card schema",
"weight": "Bolder",
"size": "Medium"
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "auto",
"items": [
{
"type": "Image",
"url": "https://pbs.twimg.com/profile_images/3647943215/d7f12830b3c17a5a9e4afcc370e3a37e_400x400.jpeg",
"size": "Small",
"style": "Person"
}
]
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "Matt Hidinger",
"weight": "Bolder",
"wrap": true
},
{
"type": "TextBlock",
"spacing": "None",
"text": "Created {{DATE(2017-02-14T06:08:39Z, SHORT)}}",
"isSubtle": true,
"wrap": true
}
]
}
]
},
{
"type": "TextBlock",
"text": "Now that we have defined the main rules and features of the format, we need to produce a schema and publish it to GitHub. The schema will be the starting point of our reference documentation.",
"wrap": true
},
{
"type": "FactSet",
"facts": [
{
"title": "Board:",
"value": "Adaptive Card"
},
{
"title": "List:",
"value": "Backlog"
},
{
"title": "Assigned to:",
"value": "Matt Hidinger"
},
{
"title": "Due date:",
"value": "Not set"
}
]
}
],
"actions": [
{
"type": "Action.ShowCard",
"title": "Set due date",
"card": {
"type": "AdaptiveCard",
"body": [
{
"type": "Input.Date",
"id": "dueDate"
}
],
"actions": [
{
"type": "Action.Submit",
"title": "OK"
}
],
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
}
},
{
"type": "Action.ShowCard",
"title": "Comment",
"card": {
"type": "AdaptiveCard",
"body": [
{
"type": "Input.Text",
"id": "comment",
"isMultiline": true,
"placeholder": "Enter your comment"
}
],
"actions": [
{
"type": "Action.Submit",
"title": "OK"
}
],
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
}
}
]
}
</script>
</head>
<body>
Visit the <a href="https://docs.microsoft.com/outlook/actionable-messages">Outlook Dev Portal</a> to learn more about Actionable Messages.
</body>
</html>

 

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

Highlighted
Community Support
Community Support

Re: Adaptive card not displaying action button Show Card

Hi @JimmyWork,

 

I tested the method provided by @DeepakS , it works and I think he is correct.

If your problem has been solved, You could go ahead and mark the post as solved by clicking “Accept as Solution” so that this thread will be marked for other users to easily identify!

Best Regards,
Community Support Team _ Lin Tu

Highlighted
Power Participant
Power Participant

Re: Adaptive card not displaying action button Show Card

@DeepakS Thank you for answering

But where do you input the "originator" part?

What i do is i use compose for the adapative card and from Microsoft site i can't find the information you are posting so i can't really understand why.

 

And your test crad contains 2x ShowCards, this works as i stated before but not if you use 1.

2020-03-18 09_31_00-Edit your flow _ Power Automate.png2020-03-18 09_33_10-Mail - EPN SYSTEMS - Outlook.png

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="application/adaptivecard+json">{
"type": "AdaptiveCard",
"version": "1.2",
"hideOriginalBody": false,
	"body": [
		{
			"type": "TextBlock",
			"text": "This card's action will show another card"
		}
	],
	"actions": [
		{
			"type": "Action.ShowCard",
			"title": "Action.ShowCard",
			"card": {
				"type": "AdaptiveCard",
				"body": [
					{
						"type": "TextBlock",
						"text": "What do you think?"
					}
				],
				"actions": [
					{
						"type": "Action.Submit",
						"title": "Neat!"
					}
				]
			}
		}
	]
}
</script>
</head>
<body>
Visit the <a href="https://docs.microsoft.com/outlook/actionable-messages">Outlook Dev Portal</a> to learn more about Actionable Messages.
</body>
</html>

 

The result will be not showing the ShowCard Action. But if you use 2x ShowCard then yes it will show.

Highlighted
Power Participant
Power Participant

Re: Adaptive card not displaying action button Show Card

@v-litu-msft I still has the same issue if you only use 1x ShowCard it will not display it.

Highlighted
Power Participant
Power Participant

Re: Adaptive card not displaying action button Show Card

@DeepakS Would u mind testing with only one showcard, as i do not have any issues with 2. Just want to confirm that the bug is there.

Highlighted
Super User
Super User

Re: Adaptive card not displaying action button Show Card

Hi @JimmyWork 

 

Here is a sample with one action card:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="application/adaptivecard+json">{
"type": "AdaptiveCard",
"version": "1.2",
"hideOriginalBody": false,
"body":[
{
"type": "TextBlock",
"text": "Publish Adaptive Card schema",
"weight": "Bolder",
"size": "Medium"
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "auto",
"items": [
{
"type": "Image",
"url": "https://pbs.twimg.com/profile_images/3647943215/d7f12830b3c17a5a9e4afcc370e3a37e_400x400.jpeg",
"size": "Small",
"style": "Person"
}
]
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "Matt Hidinger",
"weight": "Bolder",
"wrap": true
},
{
"type": "TextBlock",
"spacing": "None",
"text": "Created {{DATE(2017-02-14T06:08:39Z, SHORT)}}",
"isSubtle": true,
"wrap": true
}
]
}
]
},
{
"type": "TextBlock",
"text": "Now that we have defined the main rules and features of the format, we need to produce a schema and publish it to GitHub. The schema will be the starting point of our reference documentation.",
"wrap": true
},
{
"type": "FactSet",
"facts": [
{
"title": "Board:",
"value": "Adaptive Card"
},
{
"title": "List:",
"value": "Backlog"
},
{
"title": "Assigned to:",
"value": "Matt Hidinger"
},
{
"title": "Due date:",
"value": "Not set"
}
]
}
],
"actions": [
{
"type": "Action.ShowCard",
"title": "Set due date",
"card": {
"type": "AdaptiveCard",
"body": [
{
"type": "Input.Date",
"id": "dueDate"
}
],
"actions": [
{
"type": "Action.Submit",
"title": "OK"
}
],
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
}
}
]
}
</script>
</head>
<body>
Visit the <a href="https://docs.microsoft.com/outlook/actionable-messages">Outlook Dev Portal</a> to learn more about Actionable Messages.
</body>
</html>

 

Try this out.

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

Highlighted
Power Participant
Power Participant

Re: Adaptive card not displaying action button Show Card

@DeepakS 

Thank you but im not sure you are understanding the issue.

 

ShowCard with Textbox inside, will not be displayed. The card you provided is a submit action.
Could you please try this.

This is copied from Microsoft and the result is no showcard button, it will display the textbox thats inside the showcard but not the button itself.

 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="application/adaptivecard+json">{
"type": "AdaptiveCard",
"version": "1.2",
"hideOriginalBody": false,
	"body": [
		{
			"type": "TextBlock",
			"text": "This card's action will show another card"
		}
	],
	"actions": [
		{
			"type": "Action.ShowCard",
			"title": "Action.ShowCard",
			"card": {
				"type": "AdaptiveCard",
				"body": [
					{
						"type": "TextBlock",
						"text": "What do you think?"
					}
				],
				"actions": [
					{
						"type": "Action.Submit",
						"title": "Neat!"
					}
				]
			}
		}
	]
}
</script>
</head>
<body>
Visit the <a href="https://docs.microsoft.com/outlook/actionable-messages">Outlook Dev Portal</a> to learn more about Actionable Messages.
</body>
</html>
Highlighted
New Member

Re: Adaptive card not displaying action button Show Card

Use Action.ToggleVisibility to imitate the same behavior
Highlighted
Power Participant
Power Participant

Re: Adaptive card not displaying action button Show Card

@suvidha2802 It is a bug so i hope they will fix it, thanks anyway

Helpful resources

Announcements
firstImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

firstImage

Join the new Power Virtual Agents Community!

We are excited to announce the launch of Power Virtual Agents Community. Check it out now!

firstImage

New & Improved Power Automate Community Cookbook

We've updated and improved the layout and uploading format of the Power Automate Cookbook!

thirdimage

Power Automate Community User Group Member Badge

Fill out a quick form to claim your user group badge now!

Top Solution Authors
Top Kudoed Authors
Users online (11,866)