Databinding

The select scaffolding component (combobox) simply wraps the standard <select> element.
It provides nonetheless databinding capabilities for handy connects against datasources:

Declarative datasource fashion

Same results can be achieved in a more declarative way by wrapping a list of <pacem-data-item> elements.

Any PacemDatasourceElement can wrap <pacem-data-item> elements as a datasource.

Default option

The default - empty - option is on by default and shows the placeholder value, if provided.
Even if required as a field, the end-user should be asked to pick an option and not be unaware "victim" of automatic selections.

If preventing the default option is mandatory, then just set emptyOption property to false. See the behavior below:

Metadata

The datasource of options can be fetched from the web. Moreover, it can be subordinated to dependencies either optional or mandatory.

Note (1): All PacemDataSourceElement subclasses can be populated dynamically, yet the datasource can be subject to the current entity state.

Note (2): All form elements can be dependent on other properties either in an optional or mandatorial way.

[ { "prop": "hint", "display": { "cssClass": ["field-minimal", "field-nolabel"], "watermark": "Filter items..." } }, {"prop": "region", "type": "object", "display": { "cssClass": ["field-minimal", "field-nolabel"], "name": "Italian Region", "ui": "oneToMany", "watermark": "Pick an Italian region..." }, "isComplexType": true, "extra": { "sourceUrl": "/api/test/autocomplete?optionalHint=true" , "textProperty": "name", "valueProperty": "id", "disabledProperty": "disabled", "dependsOn": [{ "prop": "hint", "alias": "q", "optional": true }] } } ]