We found 38 matches for: UI: Form

An overview of all UI: Form blocks currently available, updated daily!

form: color input

Basic HTML color input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: form element

Basic HTML form element

In-pins

Form Prefill
An object with all the input data to be filled. E.g. provide the current document in the storage to view in the UI.

Out-pins

uicomponent
form: multiple fields

Generates rows with inputs based on the selected fields

In-pins

Validation id
Default: form. If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action
Row Render
A function per field, this allows you to generate custom HTML for the selected field. For example when you would like to show a different input than the one selected by default.
Disabled
Disables all the inputs at once
Hide Label
Hides the label
Class: Label
Class that is being used for the labels

Default:
col-4
Class: Input column
Class that is being used for the inputs

Default:
col-8
Class: Row


Default:
form-group row
Style: Row
Class: Label


Default:
col-4 col-form-label
Style: Label
Class: Input column


Default:
col-8
Style: Input column
Class: Input


Default:
form-control
Style: Input

Out-pins

uicomponent
form: code editor

Creates a code editor based on the ace module

In-pins

Field
Field to save the value in
Language
Which language should be used. Example: html, css, javascript
Tabsize
How many spaces should be used on tab

Out-pins

uicomponent
form: label translation

Basic HTML label element with a translation

In-pins

Language

Out-pins

uicomponent
form: label

Basic HTML label element

Out-pins

uicomponent
form: select option

Basic HTML select option element

In-pins

Text

Out-pins

uicomponent
form: select

Basic HTML select element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event
Hide empty option
Empty Option Text

Out-pins

uicomponent
form: numpad

A panel with buttons for each number. Easy for mobile users to fill in a pincode

In-pins

Field
Field to save the value in
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: checkbox

Basic HTML checkbox element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event
In Array
This needs to be set to true if the field is an array and the given value should be pushed into that array
Value
Used in combination with the in array in pin. If given will push the value into the array. If not given, true and false will be used.

Out-pins

uicomponent
form: custom checkbox

Custom stylable checkbox element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: price input

Custom input that automatically manages decimals

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event
Divide


Default:
1000
Decimals


Default:
2

Out-pins

uicomponent
form: url input

Basic HTML url input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: week input

Basic HTML week input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event
min. date
The minimum date that a user can start picking from (inclusive)
max. date
The maximum date that a user can pick to (inclusive).
disabled dates
A list of dates that can not be selected
enabled dates
A list of dates that can be selected

Out-pins

uicomponent
form: date input

Basic HTML date input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event
min. date
The minimum date that a user can start picking from (inclusive)
max. date
The maximum date that a user can pick to (inclusive).
disabled dates
A list of dates that can not be selected
enabled dates
A list of dates that can be selected

Out-pins

uicomponent
form: text input

Basic HTML text input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: hidden input

Basic HTML hidden input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: input

A basic input

In-pins

type
The type of input to display

Default:
text
field
Field to save the value in
class
style

Out-pins

uicomponent
form: scan input

Will be autofocused on keydown if no input is given. Executes the connected function on enter or if the given length is reached

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event
On Scan
Event

Out-pins

uicomponent
On Scan
Event
form: location input

Custom inputs to enter latitude and longitude

In-pins

Field
Field to save the value in
Is required
Checks if the code input is filled.

Default:
false

Out-pins

uicomponent
form: code input

Generates multiple inputs based on the given code length. It can further be specified to only allow numbers and to execute the on enter function after all inputs are filled

In-pins

Field
Field to save the value in
Length
Defines how many inputs to show

Default:
6
Numbers only
If set to true, the inputs will only allow numbers

Default:
false
Alpha Numeric
If set to true, the inputs will only allow A-Z and 0-9

Default:
false
Is required
Checks if the code input is filled.

Default:
false
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
On enter
Function will be executed as soon as the enter button is hit
Value
Call on enter
If set to true the inputs will call the on enter function as soon as every input is filled

Default:
false
Clear on enter
If set to true the inputs will clear the filled fields when enter is pressed or called

Default:
false

Out-pins

uicomponent
form: custom radio

Custom stylable radio element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: radio

Basic HTML radio element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: number input

Basic HTML number input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: file input

Basic HTML file input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
event

Out-pins

uicomponent
form: textarea

Basic HTML textarea element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: custom file input

Custom HTML file input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Event
Button Text
Your custom text that will show as your label
Empty File Text
Custom text when no file is selected

Out-pins

uicomponent
form: datetime local input

Basic HTML datetime local input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event
min. date
The minimum date that a user can start picking from (inclusive)
max. date
The maximum date that a user can pick to (inclusive).
disabled dates
A list of dates that can not be selected
enabled dates
A list of dates that can be selected

Out-pins

uicomponent
form: phone input

Basic HTML phone input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: password input

Basic HTML password input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: time input

Basic HTML time input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: email input

Basic HTML email input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event

Out-pins

uicomponent
form: month input

Basic HTML month input element

In-pins

Field
Field to save the value in
Validate
Applies the given validation to the element, overwrites attributes given in the attributes popup
Validation id
If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action

Default:
form
Event
min. date
The minimum date that a user can start picking from (inclusive)
max. date
The maximum date that a user can pick to (inclusive).

Out-pins

uicomponent
form: radio buttons

Generates buttons based on the objects in a given array. Will set a field to a given value on click.

In-pins

buttons
Buttons to be created. Should be the following format: [{ value, icon, text, style (optional), class (optional) }]

Default:
[]
default value
The default value to be used if the value in the array is not set.

Default:
None
default class
The default class to be used if the class in the array is not set.

Default:
btn btn-outline-primary
default style
The default style to be used if the style in the array is not set.

Default:
None
active class
The class to be set when the button is set to active.

Default:
active
field
Field to save the value in

Default:
None
validate
Applies the given validation to the element, overwrites attributes given in the attributes popup

Default:
None
event


Default:
None

Out-pins

uicomponent
form: text editor

Creates a text editor based on the quill module

In-pins

Field
Field to save the value in

Out-pins

uicomponent
form: array input

Generates rows with inputs based on the selected fields from an array

In-pins

Array field
Field to save the value in
Validation id
Default: form. If this is set the validation will be saved with that validation id. The id can be used then later used in the form validate flow action
Row render
A function per field, this allows you to generate custom HTML for the selected field. For example when you would like to show a different input than the one selected by default.
Row render
Disabled
Disables all the inputs at once
Hide Label
Hides the label
Hide Remove
Hides the remove button
Hide Add
Hides the add button
Class: Label
Class that is being used for the labels

Default:
col-4
Class: Input
Class that is being used for the inputs

Default:
col-8
Class: Row


Default:
form-group row
Style: Row
Class: Label


Default:
col-4 col-form-label
Style: Label
Class: Input column


Default:
col-8
Style: Input column
Class: Input


Default:
form-control
Style: Input

Out-pins

uicomponent
form: form

A basic form

In-pins

state prefix
content

Out-pins

uicomponent