Skip to content

EnInputCheckboxGroup

Preview

Props

NameDescriptionDefaultControl
value

Used for a raw value passed into the input.

string | number
unknown
label

Used to describe field in error message

string
null
inline

Sets 'checkbox-inline' style, makes checkboxes align horizontally.

boolean
false
horizontal

Sets the group to display horizontally.

boolean
false
labelClass

Sets the class used for the label column when using horizontal layout.

string
"col-md-3"
inputClass

Sets the class used for the input column when using horizontal layout.

string
"col-md-9"
showRequired

Displays asterisk (*) next to the group label.

boolean
true
styled

Sets an alternate style for the checkboxes.

boolean
false
name

Sets name attribute for the input. Required for proper form handling.

string
null
id

Sets id attribute for input. If left blank, it will default to the name prop. This should always be matched to a label's "for" attribute for proper accessibility.

string
null
placeholder

Sets the placeholder value.

string
null
disabled

Sets the disabled attribute.

boolean
null
required

Sets the field to required.

boolean
false
typeCast

Used to specifically validate different types.

string
"string"
mode

Sets when and how often validation occurs. TODO: create docs for modes

string
"eager"
displayOnly

Displays the value of the field in a span element, instead of as an input.

boolean
false
rules

A pipe separated string of validation rules for the field. View validation rules

string
""
renderInForm

Prevents a field from being rendered at all when used in the fields prop of the EnForm component. Can be passed a function that returns true or false for conditional validation.

boolean | function
true
renderInTable

Prevents a field from generating a column/heading in the EnTableBasic component. Can be passed a function that returns true or false for conditional validation.

boolean | function
true
customMessages

Provide a custom error messages by rule. Should be an object with keys that match the rule name and value being a string of the message to display.

object
nullcomplex object
options

Array of option objects with label and value keys.

array
unknowncomplex object
valueKey

Sets a different key to use to retrieve the value from the options passed to the component.

string
"value"
labelKey

Sets a different key to use to retrieve the label from the options passed to the component.

string
"label"
labelColors

Sets default colors for option labels in displayOnly mode

array
unknowncomplex object
optionsKey

Sets a different key to use to retrieve the options from the option groups passed to the component.

string
"options"

Slots

display

No description

Variables
NameTypeDescription
selectionsunknown

Events

blur

No description

change

No description

input

No description

Methods

NameDescription
focus

Focuses a checkbox input element in the group.

Types

Option - Object

Properties available when using an input that accepts options.

NameTypeDescription
labelstring

Display text for the option. Note: first letter is case insensitive meaning it will also try Label

valuestringnumber

Value of the option that will be emitted when selected. Note: first letter is case insensitive meaning it will also try Value

disabledboolean

Sets the option to disabled so that it cannot be selected or deselected.

labelColorstring

Overrides the default label color when using pills and display only, if supported.

tooltipstring

Adds a tooltip next to the option if supported by the input (radio, checkbox, boolean).

optionsarray

Array of Options when needing to use option groups.