...
Our goal is to provide our clients with the necessary tools and packages that will help them develop visually attractive and engaging content for their chatbots. One A step forward in this direction is the introduction of Adaptive Cards.
Using Adaptive Cards you can design Your dataintuitive and appealing cards for your chatbot that are not feasible with the existing directives.
For example, you can create a date range picker, an amelioration of Orbita’s traditional date picker directive.
You can use the below code as a directive and place it in the function node. Refer to How do I use directives? documentation.
| Code Block |
|---|
if(!msg.payload.orbita) {
msg.payload.orbita = {};
}
if(!msg.payload.orbita.directive) {
msg.payload.orbita.directive = [];
}
msg.payload.orbita.directive.push({
"type": "adaptivecard",
"template": {
"type": "AdaptiveCard",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.3",
"body": [
{
"type": "TextBlock",
"text": "Pick the Date Range",
"wrap": true,
"id": "Date_Range_Text"
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "From Date",
"wrap": true
},
{
"type": "Input.Date",
"id": "Start_Date",
"$data": "date",
"separator": true,
"value": "t"
}
]
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "TextBlock",
"text": "To Date",
"wrap": true
},
{
"type": "Input.Date",
"id": "End_Date",
"$data": "date",
"separator": true,
"value": "2020-10-19",
"label": "End Date"
},
{
"type": "Container",
"items": [
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Submit",
"title": "Submit",
"style": "positive",
"id": "Submit_Date_Range",
"ignoreInputValidation": true
}
]
}
],
"id": "Submit_Container",
"spacing": "Padding",
"height": "stretch",
"separator": false
}
]
}
]
},
{
"type": "RichTextBlock",
"inlines": [
{
"type": "TextRun",
"text": "${$root.textDate}"
}
],
"id": "Final_msg",
"$data": "${$root.textDate}"
}
],
"id": "Date_Range_Container"
},
"templateData": {
"textDate": "Data"
},
"hostAppName": {
"name": "default"
}
})
return msg; |
Related Articles
| Filter by label (Content by label) | ||||||||
|---|---|---|---|---|---|---|---|---|
|