Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
[Rendering] Dropdowns not working in Outlook for Web (OWA)
See original GitHub issueTarget Platforms
Other
SDK Version
1.0
Application Name
Outlook Web
Problem Description
I’m developing a workflow to approve orders. This orders are presented in a Adaptive Card so 1 adaptive card can have many orders to aprove with dropdowns and HTTP call with a button.
When I test it out I noticed that in client apps like Outlook for Android and Outlook for Windows the dropdowns works as expected but when I go to Outlook for Web the dropdowns are not working anymore.
Approval Workflow
- Select if Approve or Reject
- Container presented with 2 dropdowns and 1 input text
- The user fill the request data
- Clicks a button and HTTP request (power automate) is made
- The Power Automate make the data managment and then create again the adaptive card with all the previous content but updating the UI for the selected order to inform that is already approved.
- The Adaptive Card is updated and presented to the user
- Repit. This will finish once all the order are with an approval action done
All of this workflow is managed from Power Automate, this is the place where I build the Json and I send it to Outlook.
Screenshots
No response
Card JSON
{
"type": "AdaptiveCard",
"originator": "6df2a40b-fe58-43a7-b0c6-d8f9c3ef16c6",
"body": [
{
"columns": [
{
"width": "stretch",
"items": [
{
"color": "Dark",
"size": "ExtraLarge",
"text": "Order Approval",
"weight": "Bolder",
"wrap": true,
"id": "73571a0a-8dab-4ea1-b24e-690b388ddb4d",
"spacing": "Large",
"horizontalAlignment": "Center",
"type": "TextBlock"
}
],
"padding": "Large",
"spacing": "None",
"horizontalAlignment": "Center",
"type": "Column"
}
],
"padding": "Small",
"id": "deea8afe-2448-4b0d-8f4f-4739814b66a2",
"type": "ColumnSet",
"style": "emphasis"
},
{
"type": "Container",
"items": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "FactSet",
"id": "0158c507-edba-42cd-9ba6-a5eed47a21b2",
"facts": [
{
"title": "Name",
"value": "Sergi"
}
]
}
],
"padding": "None"
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "FactSet",
"id": "97734c61-6659-48f4-b80e-c46c2e4f6fb1",
"facts": [
{
"title": "Product Name",
"value": "Power Apps Per User plan"
}
]
}
],
"padding": "None"
}
],
"padding": "None"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.ShowCard",
"title": "Approve",
"card": {
"type": "AdaptiveCard",
"body": [
{
"type": "Container",
"items": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "stretch",
"items": [
{
"id": "4cedcce1-130e-4d9f-bf72-95fbfdd4b787",
"type": "Input.Date"
}
],
"padding": "None"
}
],
"padding": "None"
},
{
"type": "Input.Text",
"placeholder": "Comment (optional)",
"isMultiline": true,
"id": "35353756-7992-4c3a-bef2-2f8427bc5598comment1"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Http",
"title": "Send",
"style": "positive",
"url": "microsoft.com",
"body": "",
"headers": [
{
"name": "Authorization"
},
{
"name": "Content-type",
"value": "application/json"
}
],
"isPrimary": true,
"method": "POST"
}
]
}
],
"id": "35353756-7992-4c3a-bef2-2f8427bc5598containerApprove1",
"selectAction": {
"type": "Action.ToggleVisibility",
"id": "35353756-7992-4c3a-bef2-2f8427bc5598approve1",
"title": "approve1",
"targetElements": []
},
"padding": "None"
}
],
"padding": "None",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
},
"style": "positive",
"isPrimary": true
},
{
"type": "Action.ShowCard",
"title": "Reject",
"card": {
"type": "AdaptiveCard",
"body": [
{
"type": "Container",
"items": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"id": "130acd01-7780-4df6-abfd-0169716d3f90",
"padding": "None",
"width": "stretch",
"items": [
{
"type": "Input.ChoiceSet",
"id": "caaff810-39ae-4206-8d1d-ae116f9d7c17",
"placeholder": "Year",
"choices": [
{
"title": "2020",
"value": "2020"
},
{
"title": "2021",
"value": "2021"
},
{
"title": "2022",
"value": "2022"
}
]
}
]
},
{
"type": "Column",
"padding": "None",
"width": "stretch",
"items": [
{
"type": "Input.ChoiceSet",
"id": "00114ff1-ae3c-44a9-a5ae-ab6e2aec59a8",
"placeholder": "Month",
"choices": [
{
"title": "January",
"value": "January"
},
{
"title": "February",
"value": "February"
},
{
"title": "March",
"value": "March"
},
{
"title": "April",
"value": "April"
},
{
"title": "May",
"value": "May"
},
{
"title": "June",
"value": "June"
},
{
"title": "July",
"value": "July"
},
{
"title": "August",
"value": "August"
},
{
"title": "September",
"value": "September"
},
{
"title": "October",
"value": "October"
},
{
"title": "November",
"value": "November"
},
{
"title": "December",
"value": "December"
}
]
}
]
}
],
"padding": "None"
},
{
"type": "Input.Text",
"placeholder": "Comment (optional)",
"isMultiline": true,
"id": "35353756-7992-4c3a-bef2-2f8427bc5598comment2"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Http",
"title": "Send",
"style": "positive",
"url": "microsoft.com",
"isPrimary": true,
"method": "POST"
}
]
}
],
"id": "35353756-7992-4c3a-bef2-2f8427bc5598containerapprove2",
"selectAction": {
"type": "Action.ToggleVisibility",
"id": "35353756-7992-4c3a-bef2-2f8427bc5598approve2",
"title": "35353756-7992-4c3a-bef2-2f8427bc5598approve2",
"targetElements": []
},
"padding": "None"
}
],
"padding": "None",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
}
}
]
}
],
"separator": true,
"padding": "None"
},
{
"type": "Container",
"items": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "FactSet",
"id": "9004baba-3731-44af-a006-1306da107124",
"facts": [
{
"title": "Name",
"value": "Sergi"
}
]
}
],
"padding": "None"
},
{
"type": "Column",
"width": "stretch",
"items": [
{
"type": "FactSet",
"id": "210dac97-024b-4ffc-9f2b-cb521061dcc6",
"facts": [
{
"title": "Product Name",
"value": "M365 E5 license"
}
]
}
],
"padding": "None"
}
],
"padding": "None"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.ShowCard",
"title": "Approve",
"card": {
"type": "AdaptiveCard",
"body": [
{
"type": "Container",
"items": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": "stretch",
"items": [
{
"id": "1f09e426-2e4c-4265-85e1-1acc4bda3ee3",
"type": "Input.Date"
}
],
"padding": "None"
}
],
"padding": "None"
},
{
"type": "Input.Text",
"placeholder": "Comment (optional)",
"isMultiline": true,
"id": "8315330d-3f96-438d-9f92-30c84f6fe84ccomment1"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Http",
"title": "Send",
"style": "positive",
"url": "microsoft.com",
"body": "",
"headers": [
{
"name": "Authorization"
},
{
"name": "Content-type",
"value": "application/json"
}
],
"isPrimary": true,
"method": "POST"
}
]
}
],
"id": "8315330d-3f96-438d-9f92-30c84f6fe84ccontainerApprove1",
"selectAction": {
"type": "Action.ToggleVisibility",
"id": "8315330d-3f96-438d-9f92-30c84f6fe84capprove1",
"title": "approve1",
"targetElements": []
},
"padding": "None"
}
],
"padding": "None",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
},
"style": "positive",
"isPrimary": true
},
{
"type": "Action.ShowCard",
"title": "Reject",
"card": {
"type": "AdaptiveCard",
"body": [
{
"type": "Container",
"items": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"id": "028c23ae-23e3-41e3-a765-ac125c9937f0",
"padding": "None",
"width": "stretch",
"items": [
{
"type": "Input.ChoiceSet",
"id": "60a8010f-7fd7-4143-9dde-0b56d4a5db0b",
"placeholder": "Year",
"choices": [
{
"title": "2020",
"value": "2020"
},
{
"title": "2021",
"value": "2021"
},
{
"title": "2022",
"value": "2022"
}
]
}
]
},
{
"type": "Column",
"padding": "None",
"width": "stretch",
"items": [
{
"type": "Input.ChoiceSet",
"id": "3689a94b-4125-4140-a15e-b1f9fe2e93ac",
"placeholder": "Month",
"choices": [
{
"title": "January",
"value": "January"
},
{
"title": "February",
"value": "February"
},
{
"title": "March",
"value": "March"
},
{
"title": "April",
"value": "April"
},
{
"title": "May",
"value": "May"
},
{
"title": "June",
"value": "June"
},
{
"title": "July",
"value": "July"
},
{
"title": "August",
"value": "August"
},
{
"title": "September",
"value": "September"
},
{
"title": "October",
"value": "October"
},
{
"title": "November",
"value": "November"
},
{
"title": "December",
"value": "December"
}
]
}
]
}
],
"padding": "None"
},
{
"type": "Input.Text",
"placeholder": "Comment (optional)",
"isMultiline": true,
"id": "8315330d-3f96-438d-9f92-30c84f6fe84ccomment2"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Http",
"title": "Send",
"style": "positive",
"url": "microsoft.com",
"isPrimary": true,
"method": "POST"
}
]
}
],
"id": "8315330d-3f96-438d-9f92-30c84f6fe84ccontainerapprove2",
"selectAction": {
"type": "Action.ToggleVisibility",
"id": "8315330d-3f96-438d-9f92-30c84f6fe84capprove2",
"title": "8315330d-3f96-438d-9f92-30c84f6fe84capprove2",
"targetElements": []
},
"padding": "None"
}
],
"padding": "None",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
}
}
]
}
],
"separator": true,
"padding": "None"
}
],
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.0",
"padding": "None"
}
Sample Code Language
No response
Sample Code
No response
Issue Analytics
- State:
- Created 2 years ago
- Comments:8 (6 by maintainers)
Top Results From Across the Web
From Drop Down Menu in Outlook is not working
My "From" drop down menu in outlook stopped working. I have few mailboxes and I can't now decide from which account I will...
Read more >Outlook HTML Emails: How to Fix 11 Common Rendering ...
One of the main issues with Outlook is its inconsistent rendering across different versions. Outlook CSS support isn't great and here's why…
Read more >Outlook web addIn dropdown menu
1 Answer 1 ... It is not currently possible to dynamically populate the dropdowns, your best bet would be to have a single...
Read more >5 Ways to Fix Microsoft Outlook Web Not Working
How to Fix Outlook Web Not Working Windows 10 · Solution 1. Clear Browser Cache · Solution 2. Update the Browser · Solution...
Read more >Why Emails Render Differently in Microsoft Outlook
Microsoft Outlook has issues with rendering buttons. In the past, buttons with a modified border-radius value did not render in emails in ...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Looks like the issue was resolved. Thanks @muthurathinam and @sergibarca !
Actually, web uses somewhat higher version of the AdapitveCards SDK in comparison with Windows and Android apps. The behavior was redefined to what you see in Web. This why you see Web vs Windows and Android experience differs slightly.