AppsStudioJSON forms

Use the dropdown element

A dropdown element presents a list of options for the form operator to choose from. The options can be static (values you define at design time) or dynamic (values fetched from an API at runtime).

Use a static dropdown when the list of valid options is fixed and known in advance — for example, a list of environments like dev, staging, and production. Use a dynamic dropdown when the options depend on live system state, such as a list of devices currently managed by Configuration Manager or a list of users in an external directory. Because a dynamic dropdown fetches its options when the form loads, it always reflects current data without requiring manual updates to the form.

Dynamic dropdowns support two approaches to mapping the API response to dropdown options: Source-to-Target (extract a property directly from the response) and JSON Transformation (apply a JST to reshape the response before mapping). Use Source-to-Target when the response already contains a flat list of values. Use a JST when the data requires filtering, restructuring, or computation first.

When a single API endpoint is not sufficient, additional bindings let you combine results from multiple API calls into one dropdown.

Add a dropdown to a form

1

Open or create a form

Go to Studio > JSON Forms. Select an existing form or click + to create a new one.

Create New JSON Form dialog
2

Add the dropdown element

Drag the Dropdown element onto the canvas.

Dropdown element on the canvas
3

Open the Configure dialog

Hover over the element and click the gear icon.

Gear icon on hover
4

Set the label

Enter a name in the Label field (required) and make any other needed selections. Click Options (lower left) to open the dropdown options configuration.

Configure dialog with Label field and Options button

Configure a static dropdown

1

Select Static

Select Static and click + Option to add items. Enter a value for each. Use the trashcan icon to remove an item. Click Back when finished.

Static option configuration with multiple values added
2

Save

Click Save.

Form canvas after saving the static dropdown
3

Verify

Click the dropdown arrow to confirm the configured options appear.

Static dropdown showing the configured options

Configure a dynamic dropdown

1

Open the Configure dialog

Follow steps 3 and 4 from Add a dropdown to a form.

2

Select Dynamic

Select Dynamic.

Dynamic option selected
3

Configure the API request

Set the Method, Base URL, and API Route under Request Configuration, then click Make API Call.

Request Configuration fields

The response appears in the Response Body.

Response Body output
4

Map the data

Choose a data mapping method under Data Mapping.

Source-to-Target: Select Source-To-Target, enter the Source Property and Property Key (in the example below, /results and /id), then click Query Data.

Source-To-Target mapping with Source Property /results and Property Key /id
Target Data Preview after applying the Source-to-Target filter

JSON Transformation: Select JSON Transformation, choose a JST from the dropdown, then click Run Transformation. The data is parsed and the result is displayed — in the example below, the id field.

JSON Transformation option selected
JST selection dropdown
Run Transformation button
Result showing the id field returned by the JST

If Run Transformation is unavailable, run the JST at least once before using it in a JSON Form.

Add additional bindings

Additional bindings let you combine results from multiple API calls into a single dropdown. If one binding returns [a,b,c] and another returns [d,e,f], the dropdown displays [a,b,c,d,e,f].

Additional Binding section with a second API configuration

Click + Additional Binding to add another API configuration. To configure it, follow the dynamic dropdown steps above. To remove a binding, select it and click Remove Data Binding.