An Outlook Adaptive Card Template

Note: Input.Time is excluded from document.

Note: The adaptive-card outlook email is strict, need to add Content-Type correctly in the header to avoid 400 error.

Note: Sometimes, need to add Authorization header with no value like for Microsoft Flow, otherwise it will return 401 error.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<html>
    <head>
        <Meta http-equiv='Content-Type' Content='text/html;charset=utf-8'>
        <script type = 'application/adaptivecard+json'>
        {
            "$schema": "https://adaptivecards.io/schemas/adaptive-card.json",
            "type": "AdaptiveCard",
            "version": "1.0",
            "body": [
                {
                    "type": "ColumnSet",
                    "columns": [
                        {
                            "type": "Column",
                            "items": [
                                {      
                                    "type": "Input.Date",
                                    "id": "dateInput",
                                    "placeholder": "Choose a Date"
                                }
                            ],
                            "width": "auto"
                        },
                        {
                            "type": "Column",
                            "items": [
                                {
                                    "type": "Input.Time",
                                    "id": "timeInput"
                                }
                            ],
                            "width": "stretch"
                        }
                    ]
                },
                {
                    "type": "Input.Text",
                    "id": "noteInput",
                    "placeholder": "Leave some notes"
                }
            ],
            "actions": [
                {
                    "type": "Action.Http",
                    "title": "Booking",
                    "method": "POST",
                    "url": "some_endpoint_url",
                    "body": "{'date': '{{dateInput.value}}','time': '{{timeInput.value}}','note': '{{noteInput.value}}'}",
                    "headers": [
                        { "name": "Authorization", "value": "" },
                        { "name": "Content-Type", "value": "application/json" }
                    ]
                }
            ]
        }
        </script>
    </head>
    <body>
    </body>
</html>

Leave a Reply

Your email address will not be published. Required fields are marked *