Forum Discussion
Adaptive Card Dynamic Table Row with Input
Is there a way off returning a unique id for data input within a data bound table row;
e.g.
{
"id": "dac-adaptive-card_9a5e618395add",
"type": "AdaptiveCard",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.5",
"body": [
{
"id": "dac-table_62e669cba1fb6",
"type": "Table",
"isVisible": true,
"separator": false,
"firstRowAsHeaders": true,
"showGridLines": true,
"columns": [
{
"width": "48px"
},
{
"width": 1
},
{
"width": 1
},
{
"width": 1
}
],
"rows": [
{
"id": "dac-table-row_5b1511475aca9",
"type": "TableRow",
"isVisible": true,
"separator": false,
"style": "good",
"cells": [
{
"id": "dac-table-cell_13890654f4c46",
"type": "TableCell",
"isVisible": true,
"separator": false,
"bleed": false,
"items": []
},
{
"id": "dac-table-cell_158f02ba2663c",
"type": "TableCell",
"isVisible": true,
"separator": false,
"bleed": false,
"items": [
{
"id": "dac-text-block_25aace4759935",
"type": "TextBlock",
"isVisible": true,
"separator": false,
"isSubtle": false,
"wrap": true,
"text": "Name"
}
]
},
{
"id": "dac-table-cell_5e858cdd40b07",
"type": "TableCell",
"isVisible": true,
"separator": false,
"bleed": false,
"items": [
{
"id": "dac-text-block_b12b5994084d1",
"type": "TextBlock",
"isVisible": true,
"separator": false,
"isSubtle": false,
"wrap": true,
"text": "Company"
}
]
},
{
"id": "dac-table-cell_3f71dba1bef22",
"type": "TableCell",
"isVisible": true,
"separator": false,
"bleed": false,
"items": [
{
"id": "dac-text-block_903c643ccd425",
"type": "TextBlock",
"isVisible": true,
"separator": false,
"isSubtle": false,
"wrap": true,
"text": "Phone"
}
]
}
]
},
{
"id": "dac-table-row_0e45fb421026b",
"type": "TableRow",
"$data": "${contacts}",
"isVisible": true,
"separator": false,
"cells": [
{
"id": "dac-table-cell_05234d36b53ae",
"type": "TableCell",
"isVisible": true,
"separator": false,
"bleed": false,
"items": [
{
"id": "dac-image_f896a5e7e02c4",
"type": "Image",
"$when": "${HasPhoto == ''}",
"isVisible": true,
"separator": false,
"style": "person",
"url": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAAlC+aJAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDkuMS1jMDAxIDc5LmE4ZDQ3NTM0OSwgMjAyMy8wMy8yMy0xMzowNTo0NSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDI0LjcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjdDQjNFOEE1QkMxMTFFRUIzQURFMDFFNDY1MjAyRjEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjdDQjNFOEI1QkMxMTFFRUIzQURFMDFFNDY1MjAyRjEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpGN0NCM0U4ODVCQzExMUVFQjNBREUwMUU0NjUyMDJGMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpGN0NCM0U4OTVCQzExMUVFQjNBREUwMUU0NjUyMDJGMSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgIYZQgAAAMaSURBVHja7Jq/TxphGMdBIYClBYXUARKT1rZJExk66FjHdnV17dqO3fs3dO3q2tXZUUZNmtjiYAJJSYpAewUUbfulb/zmcp7nvdx73pE8TxyOe5/35fm87/PrJSbf7TUTsyxziRkXARAAARAAARAAARAAAZhhSYWx6GoxUytlK/k037Ss8UFn1OidxR0Apm8/XVzKzjvfFzIvK/nT0eXO165ZDJMu9Hrlwdta+br1FAxBAWpxPIGtxwXsMT9isw87w6Y1xnM1n14r5Qj2auV+LpX8fNyPEcBaKUvrhxd/YFy9PeBovZ3Am/XlBUDmUpMzh7KpkJgztP1FWv/x4IfdehvGAENQUB8RKnGJAWwt3WPnqNv67zaugiEoMB4wMRYAT4oZ2nfYGXkrQ4GEnBgxAFKketh385zrQjVOjBiA/tP6PfajTzWPhCu9kI4g5auHyr20rxPLzDsmRgxAl6iVs370a+WclsuFDoDkzqBcvS2xQAFVzzExYgBkRnt5UrXWVTC09ajAkndrzr0jAJiye/KLieX9i4f2RpqCl+jkOISKRuzoe6G9loWOTVVWxYDGAR4yvPwLKxG18Ht73cWoke032Y2qHoFW4uGmTgHWs6GISx2Ac6PL91lZoQZlj1C56xO46RbmUblxJcD5GLmdBQVw3GNUUvrWO0OOtxsHSJS5jeUFBrG6nSF4At5sAgFsP1t0hObuyU/X+goY/MFc2A3/4SzAw5eChETKiPVINZ++nPrxh8m9/qiLhvTN8yUVBmqRqRmmjCTsHK1Hf/+h3tbyZihjCi8GWMrhh+ECwI/h+rTeflHUKn+YSAYs6Fr+QgGg9TACmWTqguqYzmXDBUA+Yb5HB+FxA/bVyVpjtiF+ekEDAJtXztroT7KKkTaEiWtTPxL0AJA32Azvfx8kDAmSL39f0q3Qetq0Ho5bbxsDwFKMBH5FKADVq0TR6J+bvdpywapmLtIDYKYLGLuu0ez4inALWWd0YRagaU15pHqtRKN3zhRk3IXQBeZSSX6FT0nKPzwJgAAIgAAIgAAIgAAIgABMK/8EGACinHmDGVLxngAAAABJRU5ErkJggg==",
"size": "small"
},
{
"id": "dac-image_a54044b1eba5",
"type": "Image",
"isVisible": true,
"separator": false,
"style": "person",
"url": "${HasPhoto}",
"size": "small"
}
]
},
{
"id": "dac-table-cell_09de26a811d27",
"type": "TableCell",
"isVisible": true,
"separator": false,
"bleed": false,
"items": [
{
"id": "dac-text-block_a2909e1c1d549",
"type": "TextBlock",
"isVisible": true,
"separator": false,
"isSubtle": false,
"wrap": true,
"text": "${flName}"
}
]
},
{
"id": "dac-table-cell_16f4337b75bc8",
"type": "TableCell",
"isVisible": true,
"separator": false,
"bleed": false,
"items": [
{
"id": "dac-text-block_3a5d911c72cc9",
"type": "TextBlock",
"isVisible": true,
"separator": false,
"isSubtle": false,
"wrap": true,
"text": "${Company}"
}
]
},
{
"id": "dac-table-cell_8cb17140318af",
"type": "TableCell",
"isVisible": true,
"separator": false,
"bleed": false,
"items": [
{
"id": "phoneNumber",
"type": "Input.Text",
"isVisible": true,
"separator": false,
"isRequired": false,
"isMultiline": false,
"value": "${Phone}"
}
]
}
]
}
]
},
{
"id": "dac-action-set_48ba70e6c17ed",
"type": "ActionSet",
"isVisible": true,
"separator": false,
"actions": [
{
"id": "dac-action-execute_3b8f4c1b86f0e",
"type": "Action.Execute",
"title": "Submit"
}
]
}
],
"_modified": 1700493451320
}
with data of
{
"contacts": [
{
"HasPhoto": "https://randomuser.me/api/portraits/men/66.jpg",
"flName": "Al Balfour",
"Company": "Madison Company",
"Phone": "202.555.8300",
"$root": {
"contacts": {}
}
},
{
"HasPhoto": "",
"flName": "Albert McCaine",
"Company": "Southland Hospital",
"Phone": "408.819.7000",
"$root": {
"contacts": {}
}
}
]
}
when you submit this data it will only return the data for last phoneNumber ID
Is there a way to bind a unique id to the phoneNumber, or return the data an array of
[{"phoneNumber":"202.555.8300"}, {"phoneNumber":"408.819.7000"}]
Thanks in advance
Prasad_Das-MSFTMicrosoft
RichardRose - Adaptive Cards does not support dynamic IDs that could be bound to the data. The ID of an input field must be a constant string and cannot be bound to data.
Thanks,
Prasad Das
------------------------------------------------------------------------------------------
If the response is helpful, please click "**Mark as Best Response**" and like it. You can share your feedback via Microsoft Teams Developer Feedback link. Click here to escalate.
This is why I asked about return an array of the constant string id, rather than the last found.
This seems an oversight in the table implementation.
Table Cells allow you to add input fields bound to a id string and table rows can be repeated, the two are not compatible unless the return data from the inputs reflects the row bound data.
Allowing Input fileds in table cells is misleading otherwise as they are incomplete- Prasad_Das-MSFT
RichardRose - In the Adaptive Card, you can have multiple input fields, each with a unique ID. When the user interacts with the card and submits it, the data from these fields is sent back to your bot in a JSON object. The keys in this object correspond to the IDs of the input fields in the card.
{ "type": "AdaptiveCard", "body": [ { "type": "Input.Text", "id": "input1", "placeholder": "Input 1" }, { "type": "Input.Text", "id": "input2", "placeholder": "Input 2" } ], "actions": [ { "type": "Action.Submit", "title": "Submit" } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "version": "1.2" }In this example,
data['input1']anddata['input2']will give you the values of the corresponding input fields in the Adaptive Card. If you want to return an array of these values, you can simply put them in an array:app.adaptiveCards.actionSubmit('Action.Submit', async (context, _state, data) => { const input1 = data['input1']; const input2 = data['input2']; const result = [input1, input2]; await context.sendActivity(`Result array is: ${result}`); });This will send a message with the array of input field values.
