Sist endret: 17. jul. 2025

Datepicker

🚧 Denne dokumentasjonen er under oppdatering.

Bruk

Anatomi

Egenskaper

Påkrevde egenskaper: id, type, basicDataModelBindings.simpleBinding

EgenskapTypeBeskrivelse
idstringKomponent id. Må være unik innenfor alle oppsett/sider i et layout-set. Kan ikke slutte med punktum eller tall.
typestringKomponent typen
basicDataModelBindingsobjectDatamodellkobling til komponenten
basicDataModelBindings.simpleBindingstringDatamodellkobling til komponentens felt i datamodellen.
basicTextResourcesobjectTekstresurser for komponenten
basicTextResources.titlestringTittelen
basicTextResources.descriptionstringBeskrivelsesfelt
basicTextResources.helpstringHjelpefelt
basicTextResources.shortNamestringNavn på komponenten, som vil brukes for valideringsmeldinger. basicTextResources.title er standard.
basicTextResources.tableTitlestringTeksten som vises i kolonnen for en repeterende gruppe for komponenten. basicTextResources.title er standard.
requiredbooleanBoolean eller uttrykk som indikerer om komponenten er påkrevd når en bruker fyller ut skjemaet. Standard er false.
readOnlybooleanBoolean eller uttrykk som indikerer om komponenten skal presenteres som kun lesbar. Standard er false.
Vennligst merk at selv med skrivebeskyttede felt i komponenter, kan det for øyeblikket være mulig å oppdatere feltet ved å endre forespørselen sendt til API-et eller gjennom et direkte API-anrop.
formatstringDatoformattering. Lokal brukerdato formattering vil bli prioritert over denne innstillingen.
Eksempel: DD/MM/YYYY, MM/DD/YYYY, YYYY-MM-DD.
gridobjectInnstillinger for komponentens rammer. Brukes for å kontrollere horisontal plassering.
grid.innerGridgridPropsValgfri. Rammer for indre komponentkontekst, så som input felt dropdown. Brukes for å unngå at feltet fyller komponentens fulle bredde.
Eksempel: {xs: 12}
Se: gridProps
grid.labelGridgridPropsValgfri. Rammer for komponentens tittel. Brukes i kombinasjon med innerGrid for å likestille bredden på titler på siden.
Eksempel: {xs: 12}
Se: gridProps
hiddenbooleanBoolean eller uttrykk som indikerer om komponenten skal være skjult. Standard er false.
maxDatestringSetter den maksimalt tillatte datoen som brukeren kan velge. Du kan bruke nøkkelordene today, yesterday, tomorrow, oneYearFromNow og oneYearAgo for å definere de makismalt tillatte datoene basert på dagens dato. Standard er 2100-01-01T12:00:00.000Z.
minDatestringSetter den tidligste tillatte datoen som brukeren kan velge. Du kan bruke nøkkelordene today, yesterday, tomorrow, oneYearFromNow og oneYearAgo for å definere de tidligste tillatte datoene basert på dagens dato. Standard er 1900-01-01T12:00:00.000Z.
pageBreakobjectAngir om komponenten kan utløse sidebrytning i PDF.
pageBreak.breakAfterstringKun PDF: Verdien eller uttrykket indikerer om et sidebrytning skal legges til etter komponenten.
Kan være: auto (standard), always eller avoid.
pageBreak.breakBeforestringKun PDF: Verdien eller uttrykket indikerer om et sidebrytning skal legges til før komponenten.
Kan være: auto (standard), always eller avoid.
renderAsSummarybooleanBoolean eller uttrykk som indikerer om komponenten skal bli laget som en oppsummering. Standard er false.
timeStampbooleanBoolean verdi som indikerer om dato skal lagres som et tidsstempel. Standard er true. Hvis true: YYYY-MM-DDThh:mm:ss:sssZ, hvis false: YYYY-MM-DD.

Konfigurering

Vi oppdaterer for øyeblikket Altinn Studio med flere muligheter for innstillinger! Dokumentasjonen oppdateres fortløpende, men det kan være flere innstillinger tilgjengelig enn det som beskrives her og noen innstillinger kan være i betaversjon.

Legg til komponent

    Du kan legge til en komponent i Altinn Studio Designer ved å dra den fra komponent-listen til sideområdet. Når du velger komponenten, vises innstillingspanelet for den.

    Grunnleggende komponent:

    App/ui/layouts/{page}.json
    {
  "$schema": "https://altinncdn.no/toolkits/altinn-app-frontend/4/schemas/json/layout/layout.schema.v1.json",
    "data": {
      "layout": [
        {
          // Basic component (required properties)
        }
      ]
    }
  }
}

    Eksempler