Schema Explorer

Choose element:

Action.ToggleVisibility

An action that toggles the visibility of associated card elements.

Introduced in version 1.2

Property	Type	Required	Description	Version
type	`"Action.ToggleVisibility"`	Yes	Must be `"Action.ToggleVisibility"`.	1.2
targetElements	`TargetElement[]`	No	The array of TargetElements	1.2

Inherited properties

Property	Type	Required	Description	Version
title	`string`	No	Label for button or link that represents this action.	1.2
iconUrl	`uri`	No	Optional icon to be shown on the action in conjunction with the title. Supports data URI in version 1.2+	1.1
style	`ActionStyle`	No	Controls the style of an Action, which influences how the action is displayed, spoken, etc.	1.2
fallback	`Action`, `FallbackOption`	No	Describes what to do when an unknown element is encountered or the requires of this or any children can’t be met.	1.2
requires	`Dictionary<string>`	No	A series of key/value pairs indicating features that the item requires with corresponding minimum version. When a feature is missing or of insufficient version, fallback is triggered.	1.2

Example

JSON

{
	"type": "AdaptiveCard",
	"version": "1.2",
	"body": [
		{
			"type": "TextBlock",
			"text": "Press the buttons to toggle the images!",
			"wrap": true
		},
		{
			"type": "TextBlock",
			"text": "Here are some images:",
			"isVisible": false,
			"id": "textToToggle"
		},
		{
			"type": "ColumnSet",
			"columns": [
				{
					"type": "Column",
					"items": [
						{
							"style": "person",
							"type": "Image",
							"url": "https://picsum.photos/100/100?image=112",
							"isVisible": false,
							"id": "imageToToggle",
							"size": "medium"
						}
					]
				},
				{
					"type": "Column",
					"items": [

						{
							"type": "Image",
							"url": "https://picsum.photos/100/100?image=123",
							"isVisible": false,
							"id": "imageToToggle2",
							"size": "medium"
						}
					]
				}
			]
		}
	],
	"actions": [
		{
			"type": "Action.ToggleVisibility",
			"title": "Toggle!",
			"targetElements": [ "textToToggle", "imageToToggle", "imageToToggle2" ]
		},
		{
			"type": "Action.ToggleVisibility",
			"title": "Also Toggle!",
			"targetElements": [
				{
					"elementId": "textToToggle"
				},
				{
					"elementId": "imageToToggle"
				},
				{
					"elementId": "imageToToggle2"
				}
			]
		},
		{
			"type": "Action.ToggleVisibility",
			"title": "Show!",
			"targetElements": [
				{
					"elementId": "textToToggle",
					"isVisible": true
				},
				{
					"elementId": "imageToToggle",
					"isVisible": true
				},
				{
					"elementId": "imageToToggle2",
					"isVisible": true
				}
			]
		},
		{
			"type": "Action.ToggleVisibility",
			"title": "Hide!",
			"targetElements": [
				{
					"elementId": "textToToggle",
					"isVisible": false
				},
				{
					"elementId": "imageToToggle",
					"isVisible": false
				},
				{
					"elementId": "imageToToggle2",
					"isVisible": false
				}
			]
		},
		{
			"type": "Action.ToggleVisibility",
			"title": "Grain!",
			"targetElements": [
				{
					"elementId": "textToToggle",
					"isVisible": true
				},
				{
					"elementId": "imageToToggle",
					"isVisible": true
				},
				{
					"elementId": "imageToToggle2",
					"isVisible": false
				}
			]
		},
		{
			"type": "Action.ToggleVisibility",
			"title": "Water!",
			"targetElements": [
				{
					"elementId": "textToToggle",
					"isVisible": true
				},
				{
					"elementId": "imageToToggle",
					"isVisible": false
				},
				{
					"elementId": "imageToToggle2",
					"isVisible": true
				}
			]
		}
	]
}

Adaptive Card

{ "type": "AdaptiveCard", "version": "1.2", "body": [ { "type": "TextBlock", "text": "Press the buttons to toggle the images!", "wrap": true }, { "type": "TextBlock", "text": "Here are some images:", "isVisible": false, "id": "textToToggle" }, { "type": "ColumnSet", "columns": [ { "type": "Column", "items": [ { "style": "person", "type": "Image", "url": "https://picsum.photos/100/100?image=112", "isVisible": false, "id": "imageToToggle", "size": "medium" } ] }, { "type": "Column", "items": [ { "type": "Image", "url": "https://picsum.photos/100/100?image=123", "isVisible": false, "id": "imageToToggle2", "size": "medium" } ] } ] } ], "actions": [ { "type": "Action.ToggleVisibility", "title": "Toggle!", "targetElements": [ "textToToggle", "imageToToggle", "imageToToggle2" ] }, { "type": "Action.ToggleVisibility", "title": "Also Toggle!", "targetElements": [ { "elementId": "textToToggle" }, { "elementId": "imageToToggle" }, { "elementId": "imageToToggle2" } ] }, { "type": "Action.ToggleVisibility", "title": "Show!", "targetElements": [ { "elementId": "textToToggle", "isVisible": true }, { "elementId": "imageToToggle", "isVisible": true }, { "elementId": "imageToToggle2", "isVisible": true } ] }, { "type": "Action.ToggleVisibility", "title": "Hide!", "targetElements": [ { "elementId": "textToToggle", "isVisible": false }, { "elementId": "imageToToggle", "isVisible": false }, { "elementId": "imageToToggle2", "isVisible": false } ] }, { "type": "Action.ToggleVisibility", "title": "Grain!", "targetElements": [ { "elementId": "textToToggle", "isVisible": true }, { "elementId": "imageToToggle", "isVisible": true }, { "elementId": "imageToToggle2", "isVisible": false } ] }, { "type": "Action.ToggleVisibility", "title": "Water!", "targetElements": [ { "elementId": "textToToggle", "isVisible": true }, { "elementId": "imageToToggle", "isVisible": false }, { "elementId": "imageToToggle2", "isVisible": true } ] } ] }

Properties

targetElements

The array of TargetElements

Type: TargetElement[]
Required: No
Allowed values:
- TargetElement
- string

title

Label for button or link that represents this action.

Type: string
Required: No

iconUrl

Optional icon to be shown on the action in conjunction with the title. Supports data URI in version 1.2+

Type: uri
Version : 1.1
Required: No

style

Controls the style of an Action, which influences how the action is displayed, spoken, etc.

Type: ActionStyle
Required: No
Allowed values:
- "default": Action is displayed as normal
- "positive": Action is displayed with a positive style (typically the button becomes accent color)
- "destructive": Action is displayed with a destructive style (typically the button becomes red)

fallback

Describes what to do when an unknown element is encountered or the requires of this or any children can't be met.

Type: Action, FallbackOption
Required: No
Allowed values:
- Action.OpenUrl
- Action.ShowCard
- Action.Submit
- Action.ToggleVisibility
- "drop": Causes this element to be dropped immediately when unknown elements are encountered. The unknown element doesn't bubble up any higher.

requires

A series of key/value pairs indicating features that the item requires with corresponding minimum version. When a feature is missing or of insufficient version, fallback is triggered.

Type: Dictionary<string>
Required: No