Hjem

Checkbox

Checkbox er en komponent som benyttes i skjemaer for å gi brukeren muligheten til å avgi et eller flere svar på spørsmålet som blir stilt.

Normal

<Checkbox label={"Checkbox"} />

 Kopiert!

Disabled

advarsel
Merk at disabled bør unngås, og at bruken heller bør løses på andre måter, da fks kombinert med tydelige feilmeldinger hvis handlingen av en eller annen grunn ikke er tillatt. Ler mer om dette på siden vår om `disabled`.
<Checkbox label={"Checkbox"} disabled />

 Kopiert!

Feilmelding

Feilmeldingstekst må gjenta nøkkelord fra label

<Checkbox
  label={"Checkbox"}
  feil="Feilmeldingstekst må gjenta nøkkelord fra label"
/>

 Kopiert!

CheckboxGruppe

Denne komponenten inkluderer også en CheckboxGruppe-komponent som kan brukes til å gruppere flere checkboxer:

Hvor vil du sitte?
import { CheckboxGruppe, Checkbox } from "nav-frontend-skjema";

<CheckboxGruppe legend="Hvor vil du sitte?">
  <Checkbox label={"Bakerst"} />
  <Checkbox label={"Midten"} />
  <Checkbox label={"Fremst"} />
</CheckboxGruppe>;

 Kopiert!

Felles feilmelding

Hvor vil du sitte?

Feilmeldingstekst må gjenta nøkkelord fra label

import { CheckboxGruppe, Checkbox } from "nav-frontend-skjema";

<CheckboxGruppe
  legend="Hvor vil du sitte?"
  feil="Feilmeldingstekst må gjenta nøkkelord fra label"
>
  <Checkbox label={"Bakerst"} />
  <Checkbox label={"Midten"} />
  <Checkbox label={"Fremst"} />
</CheckboxGruppe>;

 Kopiert!

Feilmelding uten propagering av feil-prop til children

Bruk utenFeilPropagering-propen for å bestemme om feil-propen til CheckboxGruppe skal propageres til children.

Hvor vil du sitte?

Feilmeldingstekst må gjenta nøkkelord fra label

import { CheckboxGruppe, Checkbox } from "nav-frontend-skjema";

<CheckboxGruppe
  legend="Hvor vil du sitte?"
  feil="Feilmeldingstekst må gjenta nøkkelord fra label"
  utenFeilPropagering
>
  <Checkbox label={"Bakerst"} />
  <Checkbox label={"Midten"} feil />
  <Checkbox label={"Fremst"} />
</CheckboxGruppe>;

 Kopiert!

Rediger siden på Github