Skip to main content

Notifications

Power Platform Community / Forums / General / Using Adaptive Card da...
General
Answered

Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

Posted on by 37

Hey everyone, 

 

I am currently working on an implementation of a date-picker in PVA, I've managed to get to the point that I can get the adaptive card to show up in PVA just fine but I have run into multiple issues which I think are just due to my lack of understanding when it comes to adaptive cards. (https://adaptivecards.io/explorer/Input.Date.html

 

What I want to do is let customers put in holiday requests through PVA by:

- Showing a date-picker to let a user pick a holiday start date

- Passing this value back to PVA and confirming the date with the user

- Repeating the above two steps for an end-date. 

 

Then pass the start-, and end-date (ideally formated as DD-MM-YY) to a flow that checks the difference between these dates (using ticks) against a user's available holidays, and then tells a user whether or not they can actually make the request. I've gotten all these flows to work just fine, and can show the date-picker in PVA. 

 

I have two major issues: 

1. I don't know how to pass the value back to PVA, I've tried to use global variables but this has not worked, see: 

deceparis_0-1658125694572.png

Does anyone know what I am doing wrong here? I thought it may not loop correctly, or may not actually set the value right using turn.activity, I was mostly following the microsoft documentation (https://docs.microsoft.com/en-us/power-virtual-agents/advanced-bot-framework-composer-example1) and the other examples. Can someone tell me what I am doing wrong here, and maybe show an example of how to do it right? 

 

The second issue I have is that I cannot seem to call the same adaptive card twice, even if I have made a new dialog in Bot Framework Composer that is a copy of the one showing the adaptive card: 

deceparis_1-1658126284668.png

Please ignore the hard-coded dates. 🙂 Here DateCard and DateCardEnd are separate dialogs in Bot Framework Composer (and therefore topics in PVA) but the second one is skipped as you can see. 

 

I hope someone can help me understand this better, and everyone else that might want to do this (though I hope that PVABuild22 might make all of this easier). 

 

Sincerely, 

N

 

Categories:
  • anemptyhead Profile Picture
    anemptyhead 2 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    Hi, I am using adaptive card for datepicker for my bot made with RASA, and using bot framework for MS Teams channel. I am not able to send back the user selected date to my RASA Actions backend through tracker. 

    Can I get help in understanding how to send back user selected data through datepicker in context of RASA Bots running on Microsoft Teams? Below is the code to my adaptive card: 

    adaptive_card_json = {
     "type": "AdaptiveCard",
     "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
     "version": "1.3",
     "body": [
     {
     "type": "Input.Date",
     "id": "requested_departure_date",
     "title": "Select a date:",
     "value": "2023-08-01",
     "min": "2023-01-01",
     "max": "2023-12-31"
     }
     ],
     "actions": [
     {
     "type": "Action.Submit",
     "title": "Submit",
     "text" : "August 23, 2023",
     "channel": "botframework",
     "id" :"requested_departure_date", 
     "data": {
     "msteams":{
     "text":"${requested_departure_date}",
     "title":"Select",
     "type":"messageBack",
     "value" : "/modify_departure_date"
     }, 
     "style": "positive"
     }
     }
     ]
     }
     
    
    
     message = {
     "type": "message",
     "text": "Here is the calendar:",
     "attachments": [
     {
     "contentType": "application/vnd.microsoft.card.adaptive",
     "content": adaptive_card_json
     }
     ]
     }
    
     dispatcher.utter_message(json_message=message)



     

  • rubengzz7 Profile Picture
    rubengzz7 29 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    hello bro! i have another issue moreless related to this... you know how could I solve it?

     https://powerusers.microsoft.com/t5/General/Adaptive-Cards-Input-Date-Just-Month-and-Year-Multiple-Choice/m-p/1755868

  • deceparis Profile Picture
    deceparis 37 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    @rubengzz7 , very happy you managed to figure it out, the whole adaptive card thing had me really stuck for a while. In my case I had to send the adaptive card twice (once for a start date and then another time for the end date), so I copied the topic and made sure to change the IDs so that they are not identical otherwise it skipped for me anyway (as I guess the adaptive card believed that it had already been run, even if it was two different topics). Hope this thread helps someone else! 

  • rubengzz7 Profile Picture
    rubengzz7 29 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    Update I managed to avoid the bot from skipping the question.. 

     

    I open the code on the Create tab and then changed the variable 

    alwaysPrompt to true. It was in false.
     
    rubengzz7_0-1661374453799.png

    Hope it helps for someone!!

     

    Thanks

  • rubengzz7 Profile Picture
    rubengzz7 29 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    thank you very much! with your help I finally made it :D.

     

    Im experiencing another issue now because of the logic of my flow. I need to put a date range... for example from 01/01/2022 to 05/08/2022 and my plan was to send two times the adaptive card but the bot is skipping the second one and later on the log it says Traced in a previous run 😕 Maybe there is an adaptive card that ask you for the range to avoid this problem... or what else could I do?

  • jdee111 Profile Picture
    jdee111 71 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    Thanks!! I tried it this way round too 😄 

     

    jdee111_0-1661339479010.png

     

    Seemed to be happy enough!

  • deceparis Profile Picture
    deceparis 37 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    @rubengzz7 Ah, but there's progress! I have a flow running in the start that fetches user information based on their name etc.. You need some way of initializing the variable, you can do this by adding a 'ask a question' and just using the variable there, or get a flow running. Then you need to change the variable in there to be a global variable 

    deceparis_0-1661327940712.png

    So you could do something along these lines if you don't want to use a flow: 

    deceparis_1-1661328088633.png

    Note that I have turned this into a global variable by allowing external sources to set the values (just click on the variable and change the settings for it)

     

    @jdee111 so that is what I used, a global variable initialized by a flow (Power Automate), but if you can't use power automate (or it gets too expensive) just make a question topic I think. Not even sure if you could make a topic like that, and keep it empty otherwise with triggerphrases no one will ever get to, just to have the variable initialized. 

  • rubengzz7 Profile Picture
    rubengzz7 29 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    Thank you for the response. I copied the code except from the line you told me not but im having another error after selecting the date on PVA 😞

     

    We ran into a problem executing your composer dialog. The variable 'TryDate' cannot be set because it was not defined and doesn't exist in this bot
    Sent at August 23 at 3:24 PM
    Bot true said: Sorry, the bot can't talk for a while. It's something the bot's owner needs to address. Error code: 2023. Conversation ID: 2u4icdGcnrD1AXceuQcXWI-us. Time (UTC): 8/23/2022 9:24:34 PM. The variable 'TryDate' cannot be set because it was not defined and doesn't exist in this bot
    Bot true said:
    Sorry, the bot can't talk for a while. It's something the bot's owner needs to address. Error code: 2023. Conversation ID: 2u4icdGcnrD1AXceuQcXWI-us. Time (UTC): 8/23/2022 9:24:34 PM. The variable 'TryDate' cannot be set because it was not defined and doesn't exist in this bot

     

    I think the problem may be in one of this boxes

    rubengzz7_6-1661290222101.pngrubengzz7_7-1661290234038.pngrubengzz7_8-1661290262779.png

     

  • jdee111 Profile Picture
    jdee111 71 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    This is great - how did you get to pass the value back to PVA?  I see you used virtualagent.TryDate... did you use a bot variable?

  • deceparis Profile Picture
    deceparis 37 on at
    Re: Using Adaptive Card date-picker to pass back input to PVA and showing adaptive card multiple times

    Hey @rubengzz7 , 

     

    Have you added the adaptive card under 'Bot Responses'? My code there looks like: 

    # adaptivecardjson_datecard()
    - ```
    {
     "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
     "type": "AdaptiveCard",
     "version": "1.0",
     "body": [
     {
     "type": "TextBlock",
     "text": "Date Input"
     },
     {
     "type": "Input.Date",
     "id": "date",
     "placeholder": "Enter a date",
     "value": "2022-01-01"
     }
     ],
     "actions": [
     {
     "type": "Action.Submit",
     "title": "OK"
     }
     ]
    }
    ```
    
    # AdaptiveCardDateCard()
    [Activity
     Attachments = ${json(adaptivecardjson_datecard())}
    ]
    
    # DateTimeInput_Prompt_f5dxDn()
    - ${AdaptiveCardDateCard()}

     I think that is what you're missing, if you look at what my Bot Dialog then references where you get the error: 

    deceparis_0-1661236866935.png

    It is that same DateTimeInput prompt that is all the way at the end of my code snippet. If I recall correctly this was created automatically for me the first time I actually called the date card. I basically followed the Microsoft guidelines: https://docs.microsoft.com/en-us/power-virtual-agents/advanced-bot-framework-composer-example1 (1-4). I don't think you can copy my entire code-snippet, but most of it (everything except the last block starting with #DateTimeInput" as that is created by the dialog calling the card itself. 

Helpful resources

Quick Links

Exciting News for Copilot Studio Communi…

Get ready to experience a whole new level of engagement with the Copilot Studio…

Celebrating the May Super User of the…

LaurensM is an exceptional contributor to the Power Platform Community…

Check out the Copilot Studio Cookbook…

We are excited to announce our new Copilot Cookbook Gallery in the Community…

Leaderboard

#1
renatoromao Profile Picture

renatoromao 6,459

#2
Pstork1 Profile Picture

Pstork1 1,954

#3
Expiscornovus Profile Picture

Expiscornovus 1,667