Skip to main content

Checkbox

shadow

Checkbox, alebo tiež začiarkavacie políčko, je element, ktorý umožňuje používateľom vybrať jednu alebo viac možností z množiny. Kliknutím na checkbox zmeníte jeho stav na true alebo false.

Základné použitie

Placement End

Color

Indeterminate checkbox

Po pridaní atribútu indeterminate sa zobrazí checkbox, ktorého predvolený stav je neutrálny, tzn. ani true ani false.

Variant

Pridaní atribútu variant s hodnotou circle zobrazíte checkbox v okrúhlom tvare.

Atribúty a Vlastnosti

checked

DescriptionIf true, the checkbox is marked.
Attributechecked
Typeboolean
Defaultfalse

disabled

DescriptionIf true, the checkbox is disabled.
Attributedisabled
Typeboolean
Defaultfalse

value

DescriptionThe value of the check box.
Attributevalue
Typeboolean
Defaultfalse

indeterminate

DescriptionIf true, the checkbox is in an indeterminate state.
Attributeindeterminate
Typeboolean
Defaultfalse

name

DescriptionThe name of the checkbox to submit the form.
Attributename
Typestring
Defaultundefined

color

DescriptionCheckbox colour. Can be "primary", "complete", "success", "warning", "warning", or "info".
Attributecolor
Type"primary." | "complete" | "success" | "warning" | "danger" | "info" | string | undefined
Defaultundefined

placement

DescriptionThe location of the checkbox relative to the text. Can be "end".
Attributeplacement
Type"end" | undefined
Defaultundefined

Option

DescriptionCheckbox variant. Can be "circle".
AttributeOption
Type"circle" | undefined
Defaultundefined

Eventy

NameDescription
wje-toggle:inputCalled when the status of the checkbox changes (input event).
wje-toggle:changeFired when the checkbox state changes (change event).

Metódy

No public methods available for this component.

CSS Shadow Parts

NameDescription
nativeRefers to the native wrapper element of the checkbox

CSS Custom Vlastnosti

NameDescription
--wje-checkbox-border-radiusRadius of roundness of the corners of the check box
--wje-checkbox-border-widthCheckbox border width
--wje-checkbox-border-styleCheckbox border style
--wje-checkbox-border-colorCheckbox border colour
--wje-checkbox-margin-topTop indentation of checkbox
--wje-checkbox-margin-bottomLower indentation of the checkbox
--wje-checkbox-margin-inlineSide offset checkbox
--wje-checkbox-sizeCheckbox size
--wje-checkbox-checkmarkCheck icon in the checkbox
--wje-checkbox-interminateIndeterminate checkbox status icon

Sloty

NameDescription
``The contents of the checkbox label.