Skip to content

Select Component

Travis Tidwell edited this page Jul 5, 2017 · 6 revisions

JSON Schema

The JSON Schema definition for this component is defined as follows.

Core Properties

This component uses the core properties defined within the Common Parameters section.

Specific Properties

Property Description Value Required Default
dataSrc Determines which source strategy is used to populate the select drop down, the strategies are provided below. values, json, url, resource, or custom true values
data.values An array of value objects Array of value objects, where each item in the array has the following properties.
  • label - The label to show for this value
  • value - The value of this radio input
false []
data.json A JSON object which is a manual entry of the items within the select dropdown list. Any valid JSON false
data.url A url to retrieve data records from using a GET request. Any valid URL false
data.resource A resource Form ID if a resource is to be used as the data source. A Valid Form ID false
data.custom A string that will be executed JavaScript that will determine the values within this select list. Valid JavaScript which will set a values object which is the values used to populate the select list. false
valueProperty The property within each individual record to store as the value of this input. This is useful if each item within the data source list is a complex data object, but you only wish to store a property within that data object as the value of this input. Any object property. You can use "." to navigate within an object hierarchy. false
refreshOn A field within this form that will trigger a refresh of this field once the value of that field changes. This is useful if you have related select inputs that must be filtered based on the selection of another input. For example, the Make and Model dropdowns for automobile. Any form component api key false
filter The filter query to perform on the URL configured for this select list. Handlebar notation is allowed to determine a complex query that needs to be executed. Any GET request filter string false
authenticate Determines is the Form.io JWT token should be sent along with the GET request for an authenticated request. boolean false false
template The Handlebars template to show in the select text area. HTML Template. The following variables are provided.
  • item - The full submission object.
true
<span>{{ item.data }}</span>