Radioknapp

Komponent
FFieldset , FRadioField
Status
Produktionsklar
Innehåll

Använd radioknappar för att låta en användare välja ett alternativ i en lista.

Saknar du FRadioGroup-komponenten? Den är deprekerad, för detaljer se migreringsguide.

Radioknappar vs Dropplista

En dropplista bör användas om antalet alternativ är relativt stort eller är om antalet är dynamiskt och därmed kan öka i antal .

Props, Events & Slots

FFieldset

Ersätter FRadioGroup.

Props

id: string Optional

The id for the fieldset id attribute. If the prop is not set a random value will be generated.

Default: () => ElementIdService.generateElementId()

name: string Optional

Name provided to child content as sharedName for optional usage (it will not be set on the fieldset element). For radio inputs this is a shortcut to specify the shared name attribute at one place, instead of repeatedly setting the name attribute on each radio input.

Default: undefined

labelClass: string Optional

The CSS classes for the label, description and error-message slot.

Default: ""

contentClass: string Optional

The CSS classes for the default slot.

Default: ""

horizontal: boolean Optional

Aligns underlying items horizontally. Supported by radiobuttons and chip layout.

chip: boolean Optional

Displays radio and checkbox content with chip layout.

Default: false

border: boolean Optional

Displays a box with border around radiobuttons and checkboxes.

showDetails: string Optional

Sets visibility behaviour for details slot in selectable child items. By default details slot is not rendered.

  • never (default) - Never show item details.
  • when-selected - Show item details when selected.
  • always - Always show item details.

Default: "never"

Slots

label

Slot for label content. This slot is required.

description

Optional slot for description. See FLabel for details.

Bindings:

  • description-class: unknown
  • format-description-class: unknown
error-message

Slot for displaying single or several error messages.

Bindings:

  • hasError: unknown
  • validationMessage: unknown
tooltip

Slot for tooltip.

default

Slot for fieldset content.

FRadioField

Ersätter FRadioGroupField.

Props

disabled: boolean Optional

Set to true, empty string "" or string "disabled" to disable this input field.

Default: false

id: string Optional

The id for the input id attribute. The id for the label for attribute. If the prop is not set a random value will be generated.

Default: () => ElementIdService.generateElementId()

v-model: anyType Optional

The value for the input checked attribute.

value: anyType

The value for the input.

Events

change

Emitted when the value of the radiobutton changes.

Arguments:

  • <anonymous>: anyType
update:modelValue

V-model event.

Arguments:

  • <anonymous>: anyType

Slots

default

Slot for label content.

details

Slot for details, should only contain short text

Bindings:

  • height: unknown

Esc för att stänga Pil upp/ner för att navigera Enter för att välja