Form Fields are the basis of form controls in Windows Admin Center. They follow the format: <sme-form-field type="[typeName]"></sme-form-field> where [typeName] is a valid field type.

Common

Input

Attribute Type Description
disabled boolean Marks the form field as disabled
required* boolean Marks the form field as required and enables required validation checks
autofocus boolean enables autofocus on the form field
placeholder* string If applicable, identifies the placeholder text to show in the control
label string The label of the field. This is also used for aria-label properties
description string The description of the field. This is also used for aria-description properties where available
immediateValidation boolean Causes validation to occur immediatly when the control loads.
customValidate* EventEmitter<CheckValidationEventArgs> Output for custom validation on this field. Only applies to template driven forms.

* = Not available on all controls.

Type: "checkbox"

Value Type

boolean

Input

Attribute Type Description
indeterminate boolean Marks the checkbox as indeterminate. Any change to the value will reset this field.

Type: "checklist"

Value Type

Array<any> where each entry corresponds to the value of one<sme-option></sme-option>

Content

The following content types are support inside this form field

  • <sme-option></sme-option> with optional inner <ng-template></ng-template> containing additional form elements
  • Can add [disabled]="true" to <sme-option> to disable option.

Type: "combobox"

Value Type

any if [multiple=false] else Array<any>

Content

The following content types are support inside this form field

  • <sme-option></sme-option>
  • Can add [disabled]="true" to <sme-option> to disable option.

Input

Attribute Type Description
multiple boolean Indicates that multiple options are allowed

Type: "file"

Value Type

File if [multiple=false] else FileList

Input

Attribute Type Description
multiple boolean Indicates that multiple files are allowed
fileTypes string[] Indicates the type of files that are allowed
buttonLabel string The label to use on the select button
multipleFileFormat string The format to use when multiple files are selected

Type: "list"

Value Type

Array<any>, though any items added by user input will be a string

Type: "number"

Value Type

number

Input

Attribute Type Description
step number The size of each movement of the slider
min number The minimum value of the slider
max number The maximum value of the slider

Type: "password"

Value Type

string

Type: "radio-group"

Value Type

any where the value is from the currently selected <sme-option></sme-option>

Content

The following content types are support inside this form field

  • <sme-option></sme-option> with optional inner <ng-template></ng-template> containing additional form elements
  • Can add [disabled]="true" to <sme-option> to disable option.

Type: "readonly"

Value Type

string

Type: "search"

Value Type

string

Input

Attribute Type Description
count number The number of search results

Output

Attribute Type Description
search EventEmitter: string The event emitted from typing into the search field

Type: "select"

Value Type

any where the value is from the currently selected <sme-option></sme-option>

Content

The following content types are support inside this form field

  • <sme-option></sme-option>
  • Can add [disabled]="true" to <sme-option> to disable option.

Type: "slider"

Value Type

number

Input

Attribute Type Description
step number The size of each movement of the slider
min number The minimum value of the slider
max number The maximum value of the slider

Type: "tags"

Value Type

string[]

Input

Attribute Type Description
tagSplitCharacter string Indicates the character to use to split tags on.
suggestions string[] Suggestions for possible tags that the user could enter

Type: "text"

Value Type

string

Input

Attribute Type Description
multiline boolean Indicates that multiple lines should be accepted
rows* number Indicates the number of visible rows for multiline text fields
columns* number Indicates the number of visible columns for multiline text fields

* = Only available when multiline="true"

Type: "toggle-switch"

Value Type

boolean

Input

Attribute Type Description
labelOn string The label to show when the switch is on
labelOff string The label to show when the switch is off

* = Only available when multiline="true"