I have a bot created using Microsoft Bot Framework on Microsoft Teams. Once the dialog ends, I ask user for the feedback using the following Adaptive Card :
{
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.3",
"msteams": {
"width": "Full"
},
"body": [
{
"type": "Container",
"items": [
{
"type": "Container",
"items": [
{
"type": "TextBlock",
"text": "Feedback",
"horizontalAlignment": "center",
"weight": "bolder",
"size": "large",
"isSubtle": true,
"color": "accent"
},
{
"type": "TextBlock",
"text": "What would you like to share with us?",
"horizontalAlignment": "center",
"weight": "bolder",
"isSubtle": true
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"items": [
{
"type": "ActionSet",
"actions": [{
"type": "Action.ToggleVisibility",
"title": "Question",
"targetElements": [
{
"elementId" : "Question",
"isVisible": true
},
{
"elementId" : "Suggestion",
"isVisible": false
},
{
"elementId" : "Comments",
"isVisible": false
}]
}]
}]
},
{
"type": "Column",
"items": [
{
"type": "ActionSet",
"actions": [{
"type": "Action.ToggleVisibility",
"title": "Suggestion",
"targetElements": [
{
"elementId" : "Question",
"isVisible": false
},
{
"elementId" : "Suggestion",
"isVisible": true
},
{
"elementId" : "Comments",
"isVisible": false
}]
}]
}]
},
{
"type": "Column",
"items": [
{
"type": "ActionSet",
"actions": [{
"type": "Action.ToggleVisibility",
"title": "Comments",
"targetElements": [
{
"elementId" : "Question",
"isVisible": false
},
{
"elementId" : "Suggestion",
"isVisible": false
},
{
"elementId" : "Comments",
"isVisible": true
}]
}]
}]
}]
},
{
"type": "Input.Text",
"id": "Question",
"placeholder": "Enter Your Question...",
"maxLength": 500,
"isMultiline": true,
"isVisible": true
},
{
"type": "Input.Text",
"id": "Suggestion",
"placeholder": "Give Your Suggestion...",
"maxLength": 500,
"isMultiline": true,
"isVisible": false
},
{
"type": "Input.Text",
"id": "Comments",
"placeholder": "Give Your Feedback...",
"maxLength": 500,
"isMultiline": true,
"isVisible": false
},
{
"type": "ActionSet",
"actions": [{
"type": "Action.Submit",
"title": "Submit Feedback",
"data": {
"msteams": {
"type": "imBack",
"value": "Feedback Submitted."
}
},
"style": "positive"
}]
}]
}]
}]
}
So, once the user selects either of the three options Question
, Suggestion
, Comments
and adds the feedback in the Input.Text
box , I want to get that information and send it back to the user in the chat. How do I achieve this?
This is what has worked for me. So instead of using
"data": {
"msteams": {
"type": "imBack",
"value": "Feedback Submitted."
}
},
in the adaptive card actions I have just kept it as
"actions": [{
"type": "Action.Submit",
"title": "Submit Feedback",
}]
After this I added a function in the dialog as
async getFeedBack(stepContext) {
let authHeaders = stepContext.options;
if(stepContext.context.activity.value) {
let feedBackData = stepContext.context.activity.value;
feedBackData['Question'] = feedBackData['Question'] ? feedBackData['Question'] : ' ';
feedBackData['Suggestion'] = feedBackData['Suggestion'] ? feedBackData['Suggestion'] : ' ';
feedBackData['Comments'] = feedBackData['Comments'] ? feedBackData['Comments'] : ' ';
const card = CardFactory.heroCard(
'Your Feedback',
'<b>Question:</b> ' + feedBackData['Question'] + '<br>' + '<b>Suggestion:</b> ' + feedBackData['Suggestion'] + '<br>' + '<b>Comments:</b> ' + feedBackData['Comments'],
null
);
card.id = stepContext.context.activity.replyToId;
const message = MessageFactory.attachment(card);
message.id = stepContext.context.activity.replyToId;
await stepContext.context.updateActivity(message);
await stepContext.context.sendActivity({ type: ActivityTypes.Typing });
await stepContext.context.sendActivity("Thank You for your feedback.");
}
return await stepContext.endDialog(authHeaders);
}
The above function ensures that I get the Feedback and also updates the adaptive card into the hero card so that I can withhold user from making anymore updates to the feedback.