I'm trying to display a table in a Copilot but having trouble rendering data.
When I use the following in adaptive card designer (https://adaptivecards.io/designer/) it render fine:
{
"type": "AdaptiveCard",
"body": [
{
"type": "Table",
"columns": [
{
"width": 1
},
{
"width": 1
}
],
"rows": [
{
"type": "TableRow",
"cells": [
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "Column A",
"wrap": true
}
]
},
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "Column B",
"wrap": true
}
]
}
]
},
{
"type": "TableRow",
"$data": [
{
"ColumnA": "1",
"ColumnB": "A"
},
{
"ColumnA": "2",
"ColumnB": "B"
}
],
"cells": [
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "${ColumnA}",
"wrap": true
}
]
},
{
"type": "TableCell",
"items": [
{
"type": "TextBlock",
"text": "${ColumnB}",
"wrap": true
}
]
}
]
}
]
}
],
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.5"
}
Preview Output:
But when copying and pasting the adaptive card json to use within a resonse in Test Copilot it is rendered as follows:
Anyone any ideas what causes that or possible solutions. I know I could probably switch to use ColumnSet / Columns but would like to get a true table example working.
The ${...} notation is used by the adaptive card templating language to bind a template payload to a static data payload.
Adaptive Cards Template Language - Adaptive Cards | Microsoft Learn
Copilot Studio uses a different method to generate dynamic adaptive cards. In the adaptive card properties pane, you can toggle between JSON (which accepts a static payload) and Formula, which allows using PowerFX to generate the payload dynamically:
Here is an example for how a dynamic adaptive card can be generated from an array:
Display Data from Arrays in Adaptive Cards - Microsoft Copilot Studio | Microsoft Learn
Ekta Gupta
4
ricardodesouza
2
L-1234567-0
2