cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
furqanmajeed
Helper II
Helper II

How to create an adaptive Card for Multiple options?

I want to create a list of multiple options where users can select any option on a multiple choice list and get a response back based on selection. here is an example in the image. 

furqanmajeed_0-1664805719116.png

 

1 ACCEPTED SOLUTION

Accepted Solutions
HenryJammes
Copilot Studio
Copilot Studio

PVA + Bot Framework Composer to display a dynamic adaptive card

For this example, I will use the current version of Power Virtual Agents that's extensible with the Bot Framework Composer. I will provide an example on how to present a chatbot user with an adaptive card that contains dynamic content that is retrieved from an external data source. I use Dataverse in this example, but the approach should be similar for any other data source, as I retrieve data with a Power Automate cloud flow and pass the data back to Power Virtual Agents.

 

In my scenario, I start in Power Virtual Agents:

  • I create a new topic called "Store Locations" and give it a few trigger phrases.
  • I add a Question node to ask the user "What is your city"?
  • I use the default "City" entity to automatically extract the city from a user utterance.
  • I save the response as the "UserCity" variable and update the variable to make it global, so I change its scope to "Bot (any topic can access)". This is important for the rest of my demonstration because I will also pass that value to a Bot Framework Composer dialog.
  • I save my topic.

HenryJammes_1-1671133550534.png

 

Before going to Power Automate (to retrieve my data) or in Bot Framework Composer (to enrich my dialog with an adaptive card), the first thing I need to do is create and design an adaptive card.

  • There are many samples available here: https://adaptivecards.io/samples/ 
  • You can then further customize samples in the adaptive card designerhttps://adaptivecards.io/designer/.
  • In my example, I create a card with a FactSet (to display he location names and address in a small table), and then add 2 ActionSet, the first one with Action.OpenUrl actions, to open a location's page in a new window, and the second one with a Action.Submit action, to submit an option as an answer from the user.
    Note: Action.Submit will need adjustments depending on where you deploy your bot. For example if you deploy it to Microsoft Teams, you'll need to add extra information in the Data payload. You can refer to this documentation for more information: Adaptive Cards actions in Microsoft Teams.

I designed a sample card that looks like this:

HenryJammes_0-1671201916201.png

 

The corresponding card JSON payload is:

 

 

 

 

{
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "TextBlock",
            "size": "Medium",
            "weight": "Bolder",
            "text": "️ Our Locations in X"
        },
        {
            "type": "FactSet",
            "facts": [
                {
                    "title": "Option A",
                    "value": "Address 1"
                },
                {
                    "title": "Option B",
                    "value": "Address 2"
                }
            ]
        },
        {
            "type": "Container",
            "items": [
                {
                    "type": "TextBlock",
                    "text": " Open for more details",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false
                },
                {
                    "type": "ActionSet",
                    "actions": [
                        {
                            "type": "Action.OpenUrl",
                            "title": " Option A",
                            "url": "https://www.bing.com/search?q=Option A"
                        },
                        {
                            "type": "Action.OpenUrl",
                            "title": " Option B",
                            "url": "https://www.bing.com/search?q=Option B"
                        }
                    ],
                    "spacing": "None",
                    "separator": true
                },
                {
                    "type": "TextBlock",
                    "text": " Select store",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false,
                    "horizontalAlignment": "Left",
                    "spacing": "Large"
                }
            ],
            "spacing": "Large"
        },
        {
            "type": "ActionSet",
            "actions": [
                {
                    "type": "Action.Submit",
                    "title": " Option A",
                    "id": "A",
                    "data": "Option A"
                },
                {
                    "type": "Action.Submit",
                    "title": " Option B",
                    "id": "B",
                    "data": "Option B"
                }
            ]
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.3"
}

 

 

 

 

To make the adaptive card dynamic, I will use Power Automate to provide the various JSON arrays my card needs in the expected format. Because I have 3 datasets that are slighthly different, I will create 3 array variables in my cloud flow: "List Of Accounts" for the FactSet, "List Of Accounts Actions" for the first ActionSet, and "List Of Accounts Actions Submit" for the second Action Set.

 

From my topic in Power Virtual Agents:

  • I add a "Call an action" node
  • I select "Create a flow"

HenryJammes_2-1671133764441.png

 

In Power Automate:

  • I add "User City" as a text input for my flow.
  • I add 3 "Initialize variable" actions
    • integer variable "Number Of Accounts"  (I'll use it to count the number of results)
    • 3 array variables: "List Of Accounts", "List Of Accounts Actions", and "List Of Accounts Actions Submit"

HenryJammes_0-1671209492810.png

 

  • I use the "List Rows" from the Dataverse connector to retrieve a list of Accounts with a few OData expressions to optimize my query:
    • A select expressionto only retrive the Account Name, Address 1: Street 1 and Account ID (name,address1_line1,accountid)
    • A filter expression, to only retrieve active accounts that are located in the city the user provided (address1_city eq '@{triggerBody()['text']}' and statecode eq 0)
    • An order expression, so that results are sorted alphabetically (name asc)

HenryJammes_2-1671209820337.png

 

Now I need to use the data returned from my query to build the various variables I want to pass back to Power Virtual Agents and to my adaptive cards in Bot Framework Composer:

  • I add an "Apply to each" action, and select the "value" output from my "List Rows" action. That way, for each returned record, the actions I add within the "Apply to each" box will be applied.
  • First, an "Increment variable" action for the "Number Of Accounts" variable, with a value set to 1.

HenryJammes_4-1671210288211.png

  • Then 3 "Append to array variables" for my various arrays I initialized.
  • What is crucial here is to respect the JSON format that the adaptive card expects for the FactSet and the 2 ActionSet.

HenryJammes_5-1671210448377.png

 

  • Finally, in the "Return value(s) to Power Virual Agents" step, I add 4 outputs:
    • "Number Of Accounts"
    • "List Of Accounts",
    • "List Of Accounts Actions",
    • "List Of Accounts Actions Submit"
  • For array variables, I need to transform them to text format (as they were initialized as arrays). To that end, for each of them, I go the "Expression" tab, select "string" and go back to the "Dynamic Content" tab to select the variable name, and click OK.
  • I then save my cloud flow.

HenryJammes_0-1671210787266.png

 

Back in Power Virtual Agents:

  • I can see my Power Automate flows has the new 4 outputs created as variables.
  • I make the "ListOfAccounts", "ListOfAccountsActions" and "ListOfAccountsActionsSubmit" Bot-scoped variables.
  • I use the "NumberOfAccounts" variable in a Condition node so that I can have different user experienced if the city returns 0 results.
  • I save my topic

HenryJammes_2-1671210977884.png

 

I'm now going to move over to the Bot Framework Composer.

  • From the list of topics, I click on "Open in Bot Framework Composer".

HenryJammes_6-1671135297639.png

In Bot Framework Composer:

  • If I haven't done so already, I install it, authenticate and create a local folder for my changes
  • I add a new dialog for my bot that I name "ListOfAccountsAdaptiveCard

HenryJammes_3-1671211078975.png

 

  • In order for my dialog to return values to Power Virtual Agents, I add an Output: UserSelectedAccount and it's a string.

HenryJammes_4-1671211140419.png

 

  • Under "BeginDialog", I add a new "Ask a question" node of type "Text".
  • In the "Prompt for text" I click in the + icon and choose "Attachments", then "New attachment", "Create from template" and choose "Adaptive card"

HenryJammes_5-1671211275231.png

  • I expand the Attachment pane and paste my adaptive card JSON card payload, in between "- ```" and "```".
  • For each place where I want my content to be dynamic, I reference the Power Virtual Agents variables using that format: ${virtualagent.VariableName}.

HenryJammes_6-1671211522241.png

Example:

 

 

- ```{
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "TextBlock",
            "size": "Medium",
            "weight": "Bolder",
            "text": "️ Our Locations in ${virtualagent.UserCity}"
        },
        {
            "type": "FactSet",
            "facts": ${virtualagent.ListOfAccounts}
        },
        {
            "type": "Container",
            "items": [
                {
                    "type": "TextBlock",
                    "text": " Open for more details",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false
                },
                {
                    "type": "ActionSet",
                    "actions": ${virtualagent.ListOfAccountsActions},
                    "spacing": "None",
                    "separator": true
                },
                {
                    "type": "TextBlock",
                    "text": " Select store",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false,
                    "horizontalAlignment": "Left",
                    "spacing": "Large"
                }
            ],
            "spacing": "Large"
        },
        {
            "type": "ActionSet",
            "actions": ${virtualagent.ListOfAccountsActionsSubmit}
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.3"
}```

 

 

  • In "User input (Choice)", I set the "Properpty" to "dialog.result.UserSelectedAccount". That way, I am able to use the selected option in Power Virtual Agents, in a new variable.

HenryJammes_7-1671211607527.png

  • Once done, I go to the "Publish" tab, select my bot, and click "Publish selected bots"

HenryJammes_12-1671136795330.png

 

I return to my Power Virtual Agents "Store Locations" topic, and under "All other conditions", I add:

  • A message saying "OK, I have found {x] NumberOfAccounts location(s) in {x}bot.UserCity." using variables.
  • A "Redirect to another topic" node to select the "ListOfAccountsAdaptiveCard" Bot Framework dialog.
  • A message saying "You selected {x} UserSelectedAccount. Great choice!" using the new variable.

HenryJammes_8-1671211709731.png

 

And that's it.

The adaptive card with dynamic content is presented to the user:

 

HenryJammes_10-1671211857125.png

View solution in original post

8 REPLIES 8
bikashb
Frequent Visitor

I am trying the same and the only way I can think of is (if the list of items is dynamic), call Power Automate and have Power Automate generate a adaptive card with buttons. Although adaptive cards support templating / data mapping, I am not able to find a way to map buttons to a list, so right now I am composing the card json and sending that into a "Post adaptive card to MS Teams and wait for response" action. That's for teams though, but if you want generic multiple choice, then have you seen this? https://learn.microsoft.com/en-us/composer/how-to-ask-for-user-input?tabs=v2x

Thanks!

Anonymous
Not applicable

Good-day
My bot behaves unexpectedly, sustaining the state of the first call of Array and didn't get through. I reviewed quite many times and had no clue. Appreciate any insight given.
Details:
1. created a PVC topic, called Main menu, redirect to a BFC dialog called BFCmainMenu

2. created a BFC dialog, called BFCmainMenu, with:

  • set property of menu option Array
  • question in multiple choice, (Bot response/User input) set accordingly
  • branch switch inspecting the multi-choice option result to branch to corresponding dialogs (says, BFCbranchMenu) which in turn have similar setting as above hence another menu

3. The branching dialog BFCbranchMenu mentioned at last bullet point above eventually redirect to a PVC topic

4. The abovementioned PVC topic eventually redirect to BFCmainMenu

However, chatbot does not display the main-Menu anymore, instead it displays the branch-Menu.

HenryJammes
Copilot Studio
Copilot Studio

PVA + Bot Framework Composer to display a dynamic adaptive card

For this example, I will use the current version of Power Virtual Agents that's extensible with the Bot Framework Composer. I will provide an example on how to present a chatbot user with an adaptive card that contains dynamic content that is retrieved from an external data source. I use Dataverse in this example, but the approach should be similar for any other data source, as I retrieve data with a Power Automate cloud flow and pass the data back to Power Virtual Agents.

 

In my scenario, I start in Power Virtual Agents:

  • I create a new topic called "Store Locations" and give it a few trigger phrases.
  • I add a Question node to ask the user "What is your city"?
  • I use the default "City" entity to automatically extract the city from a user utterance.
  • I save the response as the "UserCity" variable and update the variable to make it global, so I change its scope to "Bot (any topic can access)". This is important for the rest of my demonstration because I will also pass that value to a Bot Framework Composer dialog.
  • I save my topic.

HenryJammes_1-1671133550534.png

 

Before going to Power Automate (to retrieve my data) or in Bot Framework Composer (to enrich my dialog with an adaptive card), the first thing I need to do is create and design an adaptive card.

  • There are many samples available here: https://adaptivecards.io/samples/ 
  • You can then further customize samples in the adaptive card designerhttps://adaptivecards.io/designer/.
  • In my example, I create a card with a FactSet (to display he location names and address in a small table), and then add 2 ActionSet, the first one with Action.OpenUrl actions, to open a location's page in a new window, and the second one with a Action.Submit action, to submit an option as an answer from the user.
    Note: Action.Submit will need adjustments depending on where you deploy your bot. For example if you deploy it to Microsoft Teams, you'll need to add extra information in the Data payload. You can refer to this documentation for more information: Adaptive Cards actions in Microsoft Teams.

I designed a sample card that looks like this:

HenryJammes_0-1671201916201.png

 

The corresponding card JSON payload is:

 

 

 

 

{
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "TextBlock",
            "size": "Medium",
            "weight": "Bolder",
            "text": "️ Our Locations in X"
        },
        {
            "type": "FactSet",
            "facts": [
                {
                    "title": "Option A",
                    "value": "Address 1"
                },
                {
                    "title": "Option B",
                    "value": "Address 2"
                }
            ]
        },
        {
            "type": "Container",
            "items": [
                {
                    "type": "TextBlock",
                    "text": " Open for more details",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false
                },
                {
                    "type": "ActionSet",
                    "actions": [
                        {
                            "type": "Action.OpenUrl",
                            "title": " Option A",
                            "url": "https://www.bing.com/search?q=Option A"
                        },
                        {
                            "type": "Action.OpenUrl",
                            "title": " Option B",
                            "url": "https://www.bing.com/search?q=Option B"
                        }
                    ],
                    "spacing": "None",
                    "separator": true
                },
                {
                    "type": "TextBlock",
                    "text": " Select store",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false,
                    "horizontalAlignment": "Left",
                    "spacing": "Large"
                }
            ],
            "spacing": "Large"
        },
        {
            "type": "ActionSet",
            "actions": [
                {
                    "type": "Action.Submit",
                    "title": " Option A",
                    "id": "A",
                    "data": "Option A"
                },
                {
                    "type": "Action.Submit",
                    "title": " Option B",
                    "id": "B",
                    "data": "Option B"
                }
            ]
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.3"
}

 

 

 

 

To make the adaptive card dynamic, I will use Power Automate to provide the various JSON arrays my card needs in the expected format. Because I have 3 datasets that are slighthly different, I will create 3 array variables in my cloud flow: "List Of Accounts" for the FactSet, "List Of Accounts Actions" for the first ActionSet, and "List Of Accounts Actions Submit" for the second Action Set.

 

From my topic in Power Virtual Agents:

  • I add a "Call an action" node
  • I select "Create a flow"

HenryJammes_2-1671133764441.png

 

In Power Automate:

  • I add "User City" as a text input for my flow.
  • I add 3 "Initialize variable" actions
    • integer variable "Number Of Accounts"  (I'll use it to count the number of results)
    • 3 array variables: "List Of Accounts", "List Of Accounts Actions", and "List Of Accounts Actions Submit"

HenryJammes_0-1671209492810.png

 

  • I use the "List Rows" from the Dataverse connector to retrieve a list of Accounts with a few OData expressions to optimize my query:
    • A select expressionto only retrive the Account Name, Address 1: Street 1 and Account ID (name,address1_line1,accountid)
    • A filter expression, to only retrieve active accounts that are located in the city the user provided (address1_city eq '@{triggerBody()['text']}' and statecode eq 0)
    • An order expression, so that results are sorted alphabetically (name asc)

HenryJammes_2-1671209820337.png

 

Now I need to use the data returned from my query to build the various variables I want to pass back to Power Virtual Agents and to my adaptive cards in Bot Framework Composer:

  • I add an "Apply to each" action, and select the "value" output from my "List Rows" action. That way, for each returned record, the actions I add within the "Apply to each" box will be applied.
  • First, an "Increment variable" action for the "Number Of Accounts" variable, with a value set to 1.

HenryJammes_4-1671210288211.png

  • Then 3 "Append to array variables" for my various arrays I initialized.
  • What is crucial here is to respect the JSON format that the adaptive card expects for the FactSet and the 2 ActionSet.

HenryJammes_5-1671210448377.png

 

  • Finally, in the "Return value(s) to Power Virual Agents" step, I add 4 outputs:
    • "Number Of Accounts"
    • "List Of Accounts",
    • "List Of Accounts Actions",
    • "List Of Accounts Actions Submit"
  • For array variables, I need to transform them to text format (as they were initialized as arrays). To that end, for each of them, I go the "Expression" tab, select "string" and go back to the "Dynamic Content" tab to select the variable name, and click OK.
  • I then save my cloud flow.

HenryJammes_0-1671210787266.png

 

Back in Power Virtual Agents:

  • I can see my Power Automate flows has the new 4 outputs created as variables.
  • I make the "ListOfAccounts", "ListOfAccountsActions" and "ListOfAccountsActionsSubmit" Bot-scoped variables.
  • I use the "NumberOfAccounts" variable in a Condition node so that I can have different user experienced if the city returns 0 results.
  • I save my topic

HenryJammes_2-1671210977884.png

 

I'm now going to move over to the Bot Framework Composer.

  • From the list of topics, I click on "Open in Bot Framework Composer".

HenryJammes_6-1671135297639.png

In Bot Framework Composer:

  • If I haven't done so already, I install it, authenticate and create a local folder for my changes
  • I add a new dialog for my bot that I name "ListOfAccountsAdaptiveCard

HenryJammes_3-1671211078975.png

 

  • In order for my dialog to return values to Power Virtual Agents, I add an Output: UserSelectedAccount and it's a string.

HenryJammes_4-1671211140419.png

 

  • Under "BeginDialog", I add a new "Ask a question" node of type "Text".
  • In the "Prompt for text" I click in the + icon and choose "Attachments", then "New attachment", "Create from template" and choose "Adaptive card"

HenryJammes_5-1671211275231.png

  • I expand the Attachment pane and paste my adaptive card JSON card payload, in between "- ```" and "```".
  • For each place where I want my content to be dynamic, I reference the Power Virtual Agents variables using that format: ${virtualagent.VariableName}.

HenryJammes_6-1671211522241.png

Example:

 

 

- ```{
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "TextBlock",
            "size": "Medium",
            "weight": "Bolder",
            "text": "️ Our Locations in ${virtualagent.UserCity}"
        },
        {
            "type": "FactSet",
            "facts": ${virtualagent.ListOfAccounts}
        },
        {
            "type": "Container",
            "items": [
                {
                    "type": "TextBlock",
                    "text": " Open for more details",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false
                },
                {
                    "type": "ActionSet",
                    "actions": ${virtualagent.ListOfAccountsActions},
                    "spacing": "None",
                    "separator": true
                },
                {
                    "type": "TextBlock",
                    "text": " Select store",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false,
                    "horizontalAlignment": "Left",
                    "spacing": "Large"
                }
            ],
            "spacing": "Large"
        },
        {
            "type": "ActionSet",
            "actions": ${virtualagent.ListOfAccountsActionsSubmit}
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.3"
}```

 

 

  • In "User input (Choice)", I set the "Properpty" to "dialog.result.UserSelectedAccount". That way, I am able to use the selected option in Power Virtual Agents, in a new variable.

HenryJammes_7-1671211607527.png

  • Once done, I go to the "Publish" tab, select my bot, and click "Publish selected bots"

HenryJammes_12-1671136795330.png

 

I return to my Power Virtual Agents "Store Locations" topic, and under "All other conditions", I add:

  • A message saying "OK, I have found {x] NumberOfAccounts location(s) in {x}bot.UserCity." using variables.
  • A "Redirect to another topic" node to select the "ListOfAccountsAdaptiveCard" Bot Framework dialog.
  • A message saying "You selected {x} UserSelectedAccount. Great choice!" using the new variable.

HenryJammes_8-1671211709731.png

 

And that's it.

The adaptive card with dynamic content is presented to the user:

 

HenryJammes_10-1671211857125.png

HenryJammes
Copilot Studio
Copilot Studio

PVA unified authoring canvas to display a dynamic adaptive card

In this second answer, I use the unified authoring canvas to provide an example on how to present a chatbot user with an adaptive card that contains dynamic content that is retrieved from an external data source. I use Dataverse in this example, but the approach should be similar for any other data source, as I retrieve data with a Power Automate cloud flow and pass the data back to Power Virtual Agents.

 

In Power Virtual Agents, using the unified authoring canvas:

  • I create a new topic called "Store Locations", give it a few trigger phrases, and add a Question node to ask the user "What is your city"?
    I use Power Virtual Agents' default "City" entity to automatically extract the city from a user utterance.
  • I save the response as the "UserCity" variable.
  • I save my topic.

HenryJammes_15-1671139957781.png

 

Before going to Power Automate (to retrieve my data) the first thing I need to do is create and design an adaptive card.

  • There are many samples available here: https://adaptivecards.io/samples/ 
  • You can then further customize samples in the adaptive card designerhttps://adaptivecards.io/designer/.
  • In my example, I create a card with a FactSet (to display the location names and address in a small table), and then add 2 ActionSet, the first one with Action.OpenUrl actions, to open a location's page in a new window, and the second one with a Action.Submit action, to submit an option as an answer from the user.

    Note: Action.Submit will need adjustments depending on where you deploy your bot. For example if you deploy it to Microsoft Teams, you'll need to add extra information in the Data payload. You can refer to this documentation for more information: Adaptive Cards actions in Microsoft Teams.

I designed a sample card that looks like this:

HenryJammes_0-1671201916201.png

 

The corresponding card JSON payload is:

 

 

{
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "TextBlock",
            "size": "Medium",
            "weight": "Bolder",
            "text": "️ Our Locations in X"
        },
        {
            "type": "FactSet",
            "facts": [
                {
                    "title": "Option A",
                    "value": "Address 1"
                },
                {
                    "title": "Option B",
                    "value": "Address 2"
                }
            ]
        },
        {
            "type": "Container",
            "items": [
                {
                    "type": "TextBlock",
                    "text": " Open for more details",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false
                },
                {
                    "type": "ActionSet",
                    "actions": [
                        {
                            "type": "Action.OpenUrl",
                            "title": " Option A",
                            "url": "https://www.bing.com/search?q=Option A"
                        },
                        {
                            "type": "Action.OpenUrl",
                            "title": " Option B",
                            "url": "https://www.bing.com/search?q=Option B"
                        }
                    ],
                    "spacing": "None",
                    "separator": true
                },
                {
                    "type": "TextBlock",
                    "text": " Select store",
                    "wrap": true,
                    "size": "Default",
                    "weight": "Bolder",
                    "color": "Accent",
                    "isSubtle": false,
                    "horizontalAlignment": "Left",
                    "spacing": "Large"
                }
            ],
            "spacing": "Large"
        },
        {
            "type": "ActionSet",
            "actions": [
                {
                    "type": "Action.Submit",
                    "title": " Option A",
                    "id": "A",
                    "data": "Option A"
                },
                {
                    "type": "Action.Submit",
                    "title": " Option B",
                    "id": "B",
                    "data": "Option B"
                }
            ]
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.3"
}

 

 

To make the adaptive card dynamic, I use Power Automate to provide the various JSON arrays my card needs in the expected format. Because I have 3 datasets that are slighthly different, I create 3 array variables in my cloud flow: "List Of Accounts" for the FactSet, "List Of Accounts Actions" for the first ActionSet, and "List Of Accounts Actions Submit" for the second Action Set.

 

From my topic in Power Virtual Agents:

  • I add a "Call an action" node
  • I select "Create a flow"

HenryJammes_16-1671140163982.png

 

In Power Automate:

  • I add "User City" as a text input for my flow.
  • I add 3 "Initialize variable" actions
    • integer variable "Number Of Accounts"  (I'll use it to count the number of results)
    • 3 array variables: "List Of Accounts", "List Of Accounts Actions", and "List Of Accounts Actions Submit"

HenryJammes_0-1671209492810.png

 

  • I use the "List Rows" from the Dataverse connector to retrieve a list of Accounts with a few OData expressions to optimize my query:
    • A select expressionto only retrive the Account Name, Address 1: Street 1 and Account ID (name,address1_line1,accountid)
    • A filter expression, to only retrieve active accounts that are located in the city the user provided (address1_city eq '@{triggerBody()['text']}' and statecode eq 0)
    • An order expression, so that results are sorted alphabetically (name asc)

HenryJammes_2-1671209820337.png

 

Now I need to use the data returned from my query to build the various variables I want to pass back to Power Virtual Agents and to my adaptive cards in Bot Framework Composer:

  • I add an "Apply to each" action, and select the "value" output from my "List Rows" action. That way, for each returned record, the actions I add within the "Apply to each" box will be applied.
  • First, an "Increment variable" action for the "Number Of Accounts" variable, with a value set to 1.

HenryJammes_4-1671210288211.png

  • Then 3 "Append to array variables" for my various arrays I initialized.
  • What is crucial here is to respect the JSON format that the adaptive card expects for the FactSet and the 2 ActionSet.

HenryJammes_5-1671210448377.png

 

  • Finally, in the "Return value(s) to Power Virual Agents" step, I add 4 outputs:
    • "Number Of Accounts"
    • "List Of Accounts",
    • "List Of Accounts Actions",
    • "List Of Accounts Actions Submit"
  • For array variables, I need to transform them to text format (as they were initialized as arrays). To that end, for each of them, I go the "Expression" tab, select "string" and go back to the "Dynamic Content" tab to select the variable name, and click OK.
  • I then save my cloud flow.

HenryJammes_0-1671210787266.png

 

Back in Power Virtual Agents:

  • I can see my Power Automate flows has the new 4 outputs.
  • I map these with new corresponding variables.
  • I use the "NumberOfAccounts" variable in a Condition node so that I can have different user experienced if the city returns 0 results.

HenryJammes_0-1671469146625.png

 

Under "All other conditions", I add:

  • A "Send a message" node with a text saying "OK, I have found {x] NumberOfAccounts location(s) in {x}bot.UserCity." using variables.
  • An "Ask a question" node, where I add "Adaptive card".
  • I save the response as the UserSelectedAccount variable.

HenryJammes_4-1671470015154.png

 

  • Under JSON, I paste the content of my adaptive card JSON payload.
  • I expand the card content,
  • I then convert the JSON to a Power Fx Formula record,
  • For each of the dynamic arrays in my adaptive card, I reference the retrieved Power Automate JSON data using Topic.VariableName within as a Power Fx record, using the ForAll, Table, and ParseJSON formulas.
{
  type: "AdaptiveCard",
  body: [
    {
      type: "TextBlock",
      size: "Medium",
      weight: "Bolder",
      text: "🗺️ Our Locations in " & Topic.UserCity
    },
    {
      type: "FactSet",
      facts: ForAll(
                Table(ParseJSON(Topic.ListOfAccounts)),
            {
                    title: Text(ThisRecord.Value.title),
                    value: Text(ThisRecord.Value.value)
            }
            )
    },
    {
      type: "Container",
      items: [
        {
          type: "TextBlock",
          text: "🔎 Open for more details",
          wrap: true,
          size: "Default",
          weight: "Bolder",
          color: "Accent",
          isSubtle: false
        },
        {
          type: "ActionSet",
          actions: ForAll(
        Table(ParseJSON(Topic.ListOfAccountsActions)),
    {
            type: Text(ThisRecord.Value.type),
            title: Text(ThisRecord.Value.title),
            url: Text(ThisRecord.Value.url)
    }
    ),
          spacing: "None",
          separator: true
        },
        {
          type: "TextBlock",
          text: "👆 Select store",
          wrap: true,
          size: "Default",
          weight: "Bolder",
          color: "Accent",
          isSubtle: false,
          horizontalAlignment: "Left",
          spacing: "Large"
        }
      ],
      spacing: "Large"
    },
    {
      type: "ActionSet",
      actions: ForAll(
        Table(ParseJSON(Topic.ListOfAccountsActionsSubmit)),
    {
            type: Text(ThisRecord.Value.type),
            title: Text(ThisRecord.Value.title),
            id: Text(ThisRecord.Value.id),
            data: Text(ThisRecord.Value.data)
    }
    )
    }
  ],
  '$schema': "http://adaptivecards.io/schemas/adaptive-card.json",
  version: "1.3"
}

HenryJammes_3-1671469883752.png

I then can:

  • Add a message saying "You selected {x} UserSelectedAccount. Great choice!" using the new variable.
  • Save my topic.

HenryJammes_5-1671470173563.png

 

And that's it.

The adaptive card with dynamic content is presented to the user:

HenryJammes_6-1671470284953.png

Anonymous
Not applicable

Excellent illustration. Despite my nil knowledge on PA, I strived to follow your guide, attempting to induce a "better solution" to my own situation. I finally got it working with numerous trial-and-error in those PA flows/external data source etc. 

I had a breakthrough in my learning!
Thank you so much HenryJammes!

Great to hear @Anonymous – we plan to create a few MS Learn articles out of these and hopefully they will be easier to follow. Feel free to reach out by private message to share the steps that require more guidance 🙂

@HenryJammes This has been really helpful! Is there a way of passing a record after clicking an action button? 

 

For example I have an adaptive card with: 

{
        type: "ActionSet",
        actions: ForAll(
          Table(ParseJSON(Topic.cdtrOutputs)),
              {
                type: "Action.Submit",
                title: Text(ThisRecord.Value.OutputCode) & " - " & Text(ThisRecord.Value.Title),
                data: {cdtrItem: Text(ThisRecord.Value)}
              }
      )
}

 

And in my schema:

kind: Record
properties:
  actionSubmitId: String
  cdtrItem:
    type:
      kind: Record

 

But this returns Null for cdtrItem.

 

The dataset is:

 

[
  {
    "OutputId": 5700,
    "OutputCode": "2023-WCR-0027",
    "Title": "Weekly Report"
  },
  {
    "OutputId": 5698,
    "OutputCode": "2023-DCR-0130",
    "Title": "Daily Report"
  }
]
Sharmilshah
Helper I
Helper I

Does this solution work only with PVA premium version?

Helpful resources

Announcements

Exclusive LIVE Community Event: Power Apps Copilot Coffee Chat with Copilot Studio Product Team

  It's time for the SECOND Power Apps Copilot Coffee Chat featuring the Copilot Studio product team, which will be held LIVE on April 3, 2024 at 9:30 AM Pacific Daylight Time (PDT).     This is an incredible opportunity to connect with members of the Copilot Studio product team and ask them anything about Copilot Studio. We'll share our special guests with you shortly--but we want to encourage to mark your calendars now because you will not want to miss the conversation.   This live event will give you the unique opportunity to learn more about Copilot Studio plans, where we’ll focus, and get insight into upcoming features. We’re looking forward to hearing from the community, so bring your questions!   TO GET ACCESS TO THIS EXCLUSIVE AMA: Kudo this post to reserve your spot! Reserve your spot now by kudoing this post.  Reservations will be prioritized on when your kudo for the post comes through, so don't wait! Click that "kudo button" today.   Invitations will be sent on April 2ndUsers posting Kudos after April 2nd at 9AM PDT may not receive an invitation but will be able to view the session online after conclusion of the event. Give your "kudo" today and mark your calendars for April 3, 2024 at 9:30 AM PDT and join us for an engaging and informative session!

Tuesday Tip: Unlocking Community Achievements and Earning Badges

TUESDAY TIPS are our way of communicating helpful things we've learned or shared that have helped members of the Community. Whether you're just getting started or you're a seasoned pro, Tuesday Tips will help you know where to go, what to look for, and navigate your way through the ever-growing--and ever-changing--world of the Power Platform Community! We cover basics about the Community, provide a few "insider tips" to make your experience even better, and share best practices gleaned from our most active community members and Super Users.   With so many new Community members joining us each week, we'll also review a few of our "best practices" so you know just "how" the Community works, so make sure to watch the News & Announcements each week for the latest and greatest Tuesday Tips!     THIS WEEK'S TIP: Unlocking Achievements and Earning BadgesAcross the Communities, you'll see badges on users profile that recognize and reward their engagement and contributions. These badges each signify a different achievement--and all of those achievements are available to any Community member! If you're a seasoned pro or just getting started, you too can earn badges for the great work you do. Check out some details on Community badges below--and find out more in the detailed link at the end of the article!       A Diverse Range of Badges to Collect The badges you can earn in the Community cover a wide array of activities, including: Kudos Received: Acknowledges the number of times a user’s post has been appreciated with a “Kudo.”Kudos Given: Highlights the user’s generosity in recognizing others’ contributions.Topics Created: Tracks the number of discussions initiated by a user.Solutions Provided: Celebrates the instances where a user’s response is marked as the correct solution.Reply: Counts the number of times a user has engaged with community discussions.Blog Contributor: Honors those who contribute valuable content and are invited to write for the community blog.       A Community Evolving Together Badges are not only a great way to recognize outstanding contributions of our amazing Community members--they are also a way to continue fostering a collaborative and supportive environment. As you continue to share your knowledge and assist each other these badges serve as a visual representation of your valuable contributions.   Find out more about badges in these Community Support pages in each Community: All About Community Badges - Power Apps CommunityAll About Community Badges - Power Automate CommunityAll About Community Badges - Copilot Studio CommunityAll About Community Badges - Power Pages Community

Tuesday Tips: Powering Up Your Community Profile

TUESDAY TIPS are our way of communicating helpful things we've learned or shared that have helped members of the Community. Whether you're just getting started or you're a seasoned pro, Tuesday Tips will help you know where to go, what to look for, and navigate your way through the ever-growing--and ever-changing--world of the Power Platform Community! We cover basics about the Community, provide a few "insider tips" to make your experience even better, and share best practices gleaned from our most active community members and Super Users.   With so many new Community members joining us each week, we'll also review a few of our "best practices" so you know just "how" the Community works, so make sure to watch the News & Announcements each week for the latest and greatest Tuesday Tips!   This Week's Tip: Power Up Your Profile!  🚀 It's where every Community member gets their start, and it's essential that you keep it updated! Your Community User Profile is how you're able to get messages, post solutions, ask questions--and as you rank up, it's where your badges will appear and how you'll be known when you start blogging in the Community Blog. Your Community User Profile is how the Community knows you--so it's essential that it works the way you need it to! From changing your username to updating contact information, this Knowledge Base Article is your best resource for powering up your profile.     Password Puzzles? No Problem! Find out how to sync your Azure AD password with your community account, ensuring a seamless sign-in. No separate passwords to remember! Job Jumps & Email Swaps Changed jobs? Got a new email? Fear not! You'll find out how to link your shiny new email to your existing community account, keeping your contributions and connections intact. Username Uncertainties Unraveled Picking the perfect username is crucial--and sometimes the original choice you signed up with doesn't fit as well as you may have thought. There's a quick way to request an update here--but remember, your username is your community identity, so choose wisely. "Need Admin Approval" Warning Window? If you see this error message while using the community, don't worry. A simple process will help you get where you need to go. If you still need assistance, find out how to contact your Community Support team. Whatever you're looking for, when it comes to your profile, the Community Account Support Knowledge Base article is your treasure trove of tips as you navigate the nuances of your Community Profile. It’s the ultimate resource for keeping your digital identity in tip-top shape while engaging with the Power Platform Community. So, dive in and power up your profile today!  💪🚀   Community Account Support | Power Apps Community Account Support | Power AutomateCommunity Account Support | Copilot Studio  Community Account Support | Power Pages

Super User of the Month | Chris Piasecki

In our 2nd installment of this new ongoing feature in the Community, we're thrilled to announce that Chris Piasecki is our Super User of the Month for March 2024. If you've been in the Community for a while, we're sure you've seen a comment or marked one of Chris' helpful tips as a solution--he's been a Super User for SEVEN consecutive seasons!   Since authoring his first reply in April 2020 to his most recent achievement organizing the Canadian Power Platform Summit this month, Chris has helped countless Community members with his insights and expertise. In addition to being a Super User, Chris is also a User Group leader, Microsoft MVP, and a featured speaker at the Microsoft Power Platform Conference. His contributions to the new SUIT program, along with his joyous personality and willingness to jump in and help so many members has made Chris a fixture in the Power Platform Community.   When Chris isn't authoring solutions or organizing events, he's actively leading Piasecki Consulting, specializing in solution architecture, integration, DevOps, and more--helping clients discover how to strategize and implement Microsoft's technology platforms. We are grateful for Chris' insightful help in the Community and look forward to even more amazing milestones as he continues to assist so many with his great tips, solutions--always with a smile and a great sense of humor.You can find Chris in the Community and on LinkedIn. Thanks for being such a SUPER user, Chris! 🌠💪

Find Out What Makes Super Users So Super

We know many of you visit the Power Platform Communities to ask questions and receive answers. But do you know that many of our best answers and solutions come from Community members who are super active, helping anyone who needs a little help getting unstuck with Business Applications products? We call these dedicated Community members Super Users because they are the real heroes in the Community, willing to jump in whenever they can to help! Maybe you've encountered them yourself and they've solved some of your biggest questions. Have you ever wondered, "Why?"We interviewed several of our Super Users to understand what drives them to help in the Community--and discover the difference it has made in their lives as well! Take a look in our gallery today: What Motivates a Super User? - Power Platform Community (microsoft.com)

March User Group Update: New Groups and Upcoming Events!

  Welcome to this month’s celebration of our Community User Groups and exciting User Group events. We’re thrilled to introduce some brand-new user groups that have recently joined our vibrant community. Plus, we’ve got a lineup of engaging events you won’t want to miss. Let’s jump right in: New User Groups   Sacramento Power Platform GroupANZ Power Platform COE User GroupPower Platform MongoliaPower Platform User Group OmanPower Platform User Group Delta StateMid Michigan Power Platform Upcoming Events  DUG4MFG - Quarterly Meetup - Microsoft Demand PlanningDate: 19 Mar 2024 | 10:30 AM to 12:30 PM Central America Standard TimeDescription: Dive into the world of manufacturing with a focus on Demand Planning. Learn from industry experts and share your insights. Dynamics User Group HoustonDate: 07 Mar 2024 | 11:00 AM to 01:00 PM Central America Standard TimeDescription: Houston, get ready for an immersive session on Dynamics 365 and the Power Platform. Connect with fellow professionals and expand your knowledge. Reading Dynamics 365 & Power Platform User Group (Q1)Date: 05 Mar 2024 | 06:00 PM to 09:00 PM GMT Standard TimeDescription: Join our virtual meetup for insightful discussions, demos, and community updates. Let’s kick off Q1 with a bang! Leaders, Create Your Events!  Leaders of existing User Groups, don’t forget to create your events within the Community platform. By doing so, you’ll enable us to share them in future posts and newsletters. Let’s spread the word and make these gatherings even more impactful! Stay tuned for more updates, inspiring stories, and collaborative opportunities from and for our Community User Groups.   P.S. Have an event or success story to share? Reach out to us – we’d love to feature you!

Users online (5,873)