Referanseskjema

Denne siden dokumenterer alle typiske skjemakomponenter som brukes i våre skjemaer, med eksempler på props, validering og forskjeller mellom Norge og Sverige. Det er ikke ment som en komplett guide til alle mulige props og variasjoner, men heller en praktisk referanse for de vanligste felttypene.

Navn

Hvordan vise fornavn og etternavn i skjema

NavnTypeDefaultBeskrivelse
namestring-Feltnavn  i skjemadata
defaultValuestring-Forhåndsutfylt fornavn
errorMessagestring-Feilmelding
isRequiredbooleantrueOm feltet er påkrevd
labelReactNode"Fornavn og mellomnavn" (NO) / "Förnamn" (SE)Label for fornavn-feltet
descriptionReactNode-Hjelpetekst under label
autoCompletebooleanundefined → "given-name" / "family-name"true/undefined sender "given-name"/"family-name" til feltene. false deaktiverer autoComplete.
Norge vs Sverige
  • Fornavn-label: "Fornavn og mellomnavn" (NO) / "Förnamn" (SE)
  • Etternavn-label: "Etternavn" (NO) / "Efternamn" (SE)
  • Validering: Identisk — maks 50 tegn for begge land
Når bør du overstyre props?
  • label: Overstyr når feltene gjelder en annen person enn brukeren selv (f.eks. mottaker, giver, foresatt, vitne). Standard-labels ("Fornavn og mellomnavn" / "Etternavn") passer kun for brukerens egne opplysninger.
  • autoComplete: Sett til false når feltene ikke gjelder brukeren selv. Browser autoComplete vil ellers fylle inn brukerens egne data i felt ment for en annen person. 
  • description: Legg til hjelpetekst når det er spesielle krav eller kontekst brukeren trenger — f.eks. "Navn som står i folkeregisteret". 
Generelt: bruk standard-props når feltet gjelder brukerens egne opplysninger. Overstyr label og deaktiver autoComplete når feltet gjelder en annen person.
Eksempler
Standard med autoComplete
Typisk bruk i innmeldingsskjema
Egendefinerte labels
Brukes når feltet gjelder en annen person, f.eks. mottaker
Uten autoComplete
For foresatt/mottaker-felt der browser autoComplete ville fylt inn feil person
Med feilmeldinger
Viser feilstatus på begge feltene
Du må fylle ut fornavn og evt. mellomnavn.
Du må fylle ut etternavn.
Individuelle felt
FirstNameField og LastNameField kan brukes hver for seg, f.eks. i overføringsskjemaet