From all the documentation I've seen online it seems like adaptive cards and their most important functions (Actions) still aren't compatible when sending to teams through an incoming webhook, correct?
What I've been doing so far is sending adaptive cards as attachments on messagecards like so:
{
"type": "message",
"attachments": [
{
"contentType": "application/vnd.microsoft.card.adaptive",
"contentUrl": null,
"content": {
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.2",
"body": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"items": [
{
"type": "Image",
"style": "default",
"url": "https://something.blabla.png",
"size": "Medium"
}
],
"width": "auto"
},
{
"type": "Column",
"items": [
{
"type": "TextBlock",
"size": "Large",
"weight": "Bolder",
"text": "Stage Environment"
}
]
}
]
},
{
"type": "TextBlock",
"size": "Medium",
"weight": "Bolder",
"text": "User Activity"
},
{
"type": "TextBlock",
"size": "Medium",
"seperator": "true",
"color": "accent",
"weight": "Bolder",
"text": "Something went wrong in the API:"
},
{
"type": "FactSet",
"id": "Data",
"facts": [
{
"title": "Errortyp",
"value": "{{ErrorType}}"
},
{
"title": "Stacktrace",
"value": "{{StackTrace}}"
}
]
}
]
}
}
]
}
Any attempt to add actions has resulted in a bad request everytime I've tried sending the payload through Postman.
Mainly my goal is to send messages to teams with a dropdown function like Action.ToggleVisibility. Is there any way to do this currently?
All native Adaptive Card schema elements, except Action.Submit, are fully supported. Please go through Send Adaptive Cards using an Incoming Webhook documentation for more information.
Pasting sample JSON for Action.ToggleVisibility using postman.
{
"type": "message",
"attachments": [
{
"contentType": "application/vnd.microsoft.card.adaptive",
"contentUrl": null,
"content": {
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.2",
"body": [
{
"type": "TextBlock",
"text": "Press the buttons to toggle the images!",
"wrap": true
},
{
"type": "TextBlock",
"text": "Here are some images:",
"isVisible": false,
"id": "textToToggle"
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"items": [
{
"style": "person",
"type": "Image",
"url": "https://picsum.photos/100/100?image=112",
"isVisible": false,
"id": "imageToToggle",
"altText": "sample image 1",
"size": "medium"
}
]
},
{
"type": "Column",
"items": [
{
"type": "Image",
"url": "https://picsum.photos/100/100?image=123",
"isVisible": false,
"id": "imageToToggle2",
"altText": "sample image 2",
"size": "medium"
}
]
}
]
}
],
"actions": [
{
"type": "Action.ToggleVisibility",
"title": "Toggle!",
"targetElements": [
"textToToggle",
"imageToToggle",
"imageToToggle2"
]
},
{
"type": "Action.ToggleVisibility",
"title": "Show!",
"targetElements": [
{
"elementId": "textToToggle",
"isVisible": true
},
{
"elementId": "imageToToggle",
"isVisible": true
},
{
"elementId": "imageToToggle2",
"isVisible": true
}
]
},
{
"type": "Action.ToggleVisibility",
"title": "Hide!",
"targetElements": [
{
"elementId": "textToToggle",
"isVisible": false
},
{
"elementId": "imageToToggle",
"isVisible": false
},
{
"elementId": "imageToToggle2",
"isVisible": false
}
]
}
]
}
}
]
}