How can I send Adaptive cards with Action.submit through MS Graph API and redirect to an endpoint?

Question

POST https://graph.microsoft.com/v1.0/teams/{id}/channels/{id}/messages  
Content-type: application/json  
  
{  
    "subject": null,  
    "body": {  
        "contentType": "html",  
        "content": "<attachment id=\"74d20c7f34aa4a7fb74e2b30004247c5\"></attachment>"  
    },  
    "attachments": [  
        {  
            "id": "74d20c7f34aa4a7fb74e2b30004247c5",  
            "contentType": "application/vnd.microsoft.card.thumbnail",  
            "contentUrl": null,  
            "content": "{\r\n  \"title\": \"This is an example of posting a card\",\r\n  \"subtitle\": \"<h3>This is the subtitle</h3>\",\r\n  \"text\": \"Here is some body text. <br>\\r\\nAnd a <a href=\\\"http://microsoft.com/\\\">hyperlink</a>. <br>\\r\\nAnd below that is some buttons:\",\r\n  \"buttons\": [\r\n    {\r\n      \"type\": \"messageBack\",\r\n      \"title\": \"Login to FakeBot\",\r\n      \"text\": \"login\",\r\n      \"displayText\": \"login\",\r\n      \"value\": \"login\"\r\n    }\r\n  ]\r\n}",  
            "name": null,  
            "thumbnailUrl": null  
        }  
    ]  
}

Answer 1

Hi Karthik,

The only action supported on cards sent through Graph is openurl.

Action.submit and other actions are currently not supported when card is sent through Graph API.

Answer 2

Hi Karthik

Hope you are doing well.

As per the documentation, Microsoft has rolled out existing action types from adaptive cards and introduced with new universal actions for Adaptive cards.

Basically, we need to have to handle actions differently to send the same card to different places like Teams, Outlook. To overcome this Microsoft has introduced the universal action called “Action.execute” for Adaptive cards which works across apps, such as Teams and Outlook.

Before the Universal Actions for Adaptive Cards, different hosts provided different action models as follows:

• Teams or bots used “Action.Submit”, an approach which defers the actual communication model to the underlying channel.
• Outlook used “Action.Http” to communicate with the backend service explicitly specified in the Adaptive Card payload.

With the Universal Actions for Adaptive Cards, you can use Action.Execute for action handling across different platforms. Action.Execute works across hubs including Teams and Outlook. In addition, an Adaptive Card can be returned as response for an Action.Execute triggered invoke request.

I am able to successfully post an adaptive card message of action type: "Action.Execute" using Graph API: POST /teams/{team-id}/channels/{channel-id}/messages with below request payload.

{
    "body": {
        "contentType": "html",
        "content": "<attachment id=\"4465B062-EE1C-4E0F-B944-3B7AF61EAF40\"></attachment>"
    },
    "attachments": [
        {
            "id": "4465B062-EE1C-4E0F-B944-3B7AF61EAF40",
            "contentType": "application/vnd.microsoft.card.adaptive",
            "content": "{        \"type\": \"AdaptiveCard\",        \"$schema\": \http://adaptivecards.io/schemas/adaptive-card.json\,        \"version\": \"1.3\",        \"body\": [          {            \"type\": \"TextBlock\",            \"size\": \"Large\",            \"weight\": \"Bolder\",            \"text\": \"My News Item\",            \"wrap\": true          }        ],        \"actions\": [          {            \"type\": \"Action.Execute\",            \"title\": \"View\",            \"url\": \https://bing.com\          }        ]      }"
        }
    ]
}

The few examples on how to use "Action.Execute" universal action model in adaptive cards has been explained in this documentation and you can try it by directly clicking on the buttons in these examples.

Please find additional documentation reference and available code samples on this.

https://learn.microsoft.com/en-us/microsoftteams/platform/task-modules-and-cards/cards/universal-actions-for-adaptive-cards/work-with-universal-actions-for-adaptive-cards

https://learn.microsoft.com/en-us/adaptive-cards/authoring-cards/universal-action-model

Code Samples: https://learn.microsoft.com/en-us/microsoftteams/platform/task-modules-and-cards/cards/universal-actions-for-adaptive-cards/work-with-universal-actions-for-adaptive-cards#code-samples.

Hope this helps.

If the answer is helpful, please click Accept Answer and kindly upvote. If you have any further questions about this answer, please click Comment.

Answer 3

Hi Karthik,

The only card action supported on cards sent through Graph is openurl.

Action.Submit and other actions are not supported when card is being sent through Graph API.