On demand controls with fx-control-menu

In some situations you may want to give the user the option of adding fields or displaying them just on demand.

fx-control-menu is a component displaying a simple button to access a popup list of controls that are available but not currently displayed.

fx-control-menu looks up all child elements with a 'on-demand' attribute starting from the selected element.

By choosing a item the user can make that control visible.

Why having 'on-demand' when we have the relevant facet? - the logic of the relevance of data might differ from the input logic. With 'on-demand' it's easier to pass control to users for a single field.

IMPORTANT: fx-control-menu in conjunction with 'on-demand' just shows/hides controls - it has no effect on constraints or relevance of controls.

mode 'hide-on-empty' and show-icon

If you want your form to hide all empty controls you can use mode="hide-on-empty". This will hide all controls that have no widget value.

This example also uses show-icon attribute on the ancestor fx-group. When this attribute is found on a control or an ancestor a trask icon will be displayed to remove the added field from view.

show-control and hide-control

Each control getting activated will fire a show-control event. Each control getting deactivated will fire a hide-control event.