Select Input

296 views

This control corresponds to the Combo box control.

When you place a component, the following code is defined by default:

<mat-form-field appearance=”outline” data-comp-id=”mat-select-input.1″ id=”mat-select-input.1″>

<mat-select>

<mat-option></mat-option>

</mat-select>

</mat-form-field>

It has the following properties:

Properties

content

Data

Specify the [Image] control defined in the Magic program.
Click the gear button to display a list of controls. You can select from here. It
maps to the Magic item and passes click events, etc. to the Magic side.

Label

Specify the text to display.
Click the gear button to display a dialogue where you can enter the text to display or select an Angular function.

Error

Specifies the text to display as an error message.
Errors are initially hidden and are shown in invalid form fields after the user interacts with the element or the parent form is submitted. Errors
occupy the same space as the hint, so the hint is hidden when the error is shown.
Clicking the gear button displays a dialogue where you can enter text to display and select an Angular function.

Multi Select

Specifies whether multiple selections are allowed.
In this case, checkboxes are displayed before the options.

is inside Table

Check this box if you want to place it inside a table.
Adding this will add the [rowId]=”row.rowId” tag.
If you do not check this box even though the event is inside a table, it will always be treated as the first-row event.

Show Control

Specifies whether to display the control. You can choose from the following. This
is only valid if “Is Inside Table” is checked.

None – Always displayed.
Is Row Edit – Only visible in edit mode.
Is Row Read – Only displayed in Inquiry 8 mode.

Required

Specifies whether the end user must enter a value into the control.

Appearance

Specify the display method from the following:

outline – A border is displayed around the form fields.
fill – The appearance of the form field is a filled background box and underline.

Display If

Specifies whether the end user must enter a value into the control.
Clicking the gear button will display a list of Angular functions.
You can specify and define functions from here.
If it is “False”, it will not be displayed on the canvas.

Class

You can define any class.