c# - How to work properly with advanced Adaptive Cards?

Question

Multiple question

1. Building Adaptive Cards dynamically

I'm creating an Order confirm card where there's an entry for every product and quantity. There's also a button to delete the entry and another button to modify its quantity.

The amount of products displayed will vary based on the amount of Product objects I've stored in a list. The card is a JSON template without any products that I want to be able to modify through my code (add the product columns, the buttons, their respective actions), etc.

What is the best way to accomplish that without having to build a Deserializer? (I don't want to be deserializing every Container, FactSet, etc. into useless objects).

2. Updating the Adaptive card

Every Product row will have a button to delete from the Order I can achieve that making it inivisble and then deleting the object with a submit action*. But when I change the amount of Products an entry has, how can I update the Product quantity value without resending the adaptive card?

• Can an Item have a "selectAction": "Action.toggleVisibility" and an "type": "Action.Submit" at the same time?

3. Handling submit actions

All these buttons will have a set of different submit actions. Let's say something like this:

switch(action)
{
   case "delete1":
      //Deletes product 1 from the Order
      break;

   case "delete2":
      //Deletes product 2 from the Order
      break;
   ...
}

Should this handler go to some type of Middleware, maybe in the bot class (i suppose this shouldn't go in the MainDialog since mine is a WaterFallDialog). What is the advisable way of handling those?

Answer 1

I've answered each of those questions a few times. I have a feeling you'll run into more, so feel free to search my user for Adaptive Card questions.

For each of your questions, specifically:

1. Build Adaptive Cards dynamically
2. Updating the Adaptive card -- I do this in Teams. Generally speaking, if the channel has an "Edit" button for messages, you only need UpdateActivityAsync() (If you can't "Edit" a message, that channel won't support updating a previously-sent Adaptive Card). Teams just needs some additional steps.
   • Here's another example, in C#
3. Handle submit actions - This is for Waterfall Dialogs, which is how you should do it. If you want to do it a different way, read the top half of the answer to understand how they work and implement it in OnMessageAsync.

---

Other Resources

• Official Botframework blog post on Adaptive Cards
• AdaptiveCardPrompt. Auto-handles the Submit action and does a lot of other useful stuff. Might be integrated into the Botframework SDK someday. If you like it, show your support with a thumbs-up in that issue. You can still use the class, yourself, too.
• Search Kyle Delaney's Adaptive Card answers. He handles a lot of Adaptive Card questions, too.
• Adaptive Cards Templating - In Preview/Alpha, but allows you to create cards a little more dynamically within the card's JSON.

---

Update to answer 2.1

I believe this is possible. You'd need the Submit action and then also have a Container that contains the ToggleVisibility action (or vice versa). Something like this:

{
    "type": "AdaptiveCard",
    "version": "1.0",
    "body": [
        {
            "type": "Container",
            "selectAction": {
                "type": "Action.ToggleVisibility",
                "targetElements": [
                    "showMe"
                ]
            },
            "items": [
                {
                    "type": "TextBlock",
                    "text": "Click me"
                }
            ]
        },
        {
            "type": "Container",
            "id": "showMe",
            "items": [
                {
                    "type": "TextBlock",
                    "text": "New TextBlock"
                }
            ],
            "isVisible": false
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "selectAction": {
        "type": "Action.Submit",
        "data": "ok"
    }
}

I haven't tested this in a bot, just played around in the card designer