Samples and Templates

These samples are just a teaser of the type of cards you can create. Go ahead and tweak them to make any scenario possible!

Choose sample:

Templating enables the separation of data from the layout in an Adaptive Card. It helps design a card once, and then populate it with real data at runtime. Note: The binding syntax changed in May 2020. Get started with templating

Show card wizard child cards sample

JSON
{
	"type": "AdaptiveCard",
	"version": "1.0",
	"body": [
		{
			"type": "TextBlock",
			"text": "Please provide the following information:"
		}
	],
	"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
	"actions": [
		{
			"type": "Action.ShowCard",
			"title": "1. Name",
			"card": {
				"type": "AdaptiveCard",
				"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
				"body": [
					{
						"type": "Container",
						"id": "nameProperties",
						"items": [
							{
								"type": "Input.Text",
								"placeholder": "First Name",
								"id": "FirstName",
								"isRequired": true,
								"errorMessage": "First Name is required"
							},
							{
								"type": "Input.Text",
								"placeholder": "Middle Name",
								"id": "MiddleName"
							},
							{
								"type": "Input.Text",
								"placeholder": "Last Name",
								"id": "LastName",
								"isRequired": true,
								"errorMessage": "Last Name is required"
							}
						]
					}
				],
				"actions": [
					{
						"type": "Action.ShowCard",
						"title": "2. Address",
						"card": {
							"type": "AdaptiveCard",
							"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
							"body": [
								{
									"type": "Container",
									"id": "addressProperties",
									"items": [
										{
											"type": "Input.Text",
											"placeholder": "Address line 1",
											"id": "AddressLine1"
										},
										{
											"type": "Input.Text",
											"placeholder": "Address line 2",
											"id": "AddressLine2"
										},
										{
											"type": "ColumnSet",
											"columns": [
												{
													"type": "Column",
													"width": "stretch",
													"items": [
														{
															"type": "Input.Text",
															"placeholder": "City",
															"id": "City"
														}
													]
												},
												{
													"type": "Column",
													"width": "stretch",
													"items": [
														{
															"type": "Input.Text",
															"placeholder": "State",
															"id": "State"
														}
													]
												},
												{
													"type": "Column",
													"width": "stretch",
													"items": [
														{
															"type": "Input.Text",
															"placeholder": "Zip Code",
															"id": "Zip"
														}
													]
												}
											]
										}
									]
								}
							],
							"actions": [
								{
									"type": "Action.ShowCard",
									"title": "3. Phone/Email",
									"card": {
										"type": "AdaptiveCard",
										"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
										"body": [
											{
												"type": "Input.Text",
												"placeholder": "Cell Number",
												"id": "CellPhone"
											},
											{
												"type": "Input.Text",
												"placeholder": "Home Number",
												"id": "HomePhone"
											},
											{
												"type": "Input.Text",
												"placeholder": "Email Address",
												"id": "Email"
											}
										],
										"actions": [
											{
												"type": "Action.Submit",
												"title": "Submit"
											}
										]
									}
								}
							]
						}
					}
				]
			}
		}
	]
}
Adaptive Card