Altinn / Altinn/app-frontend-react
OrganisationLookup component bypasses required field validation on bound data model field
- Dominant language
- TypeScript
- Stars
- 21
- Forks
- 33
- Avg merge
- 6d 23h
- Merged PRs (30d)
- 3
Description
### Description of the bug
When an OrganisationLookup component is bound to a data model field that is marked as required (Påkrevd), the required validation is not enforced. The user can submit the form without filling in the organisation number.
### Steps To Reproduce
## Steps to reproduce
1. In the data model, mark EngasjertVirksomhet.Organisasjonsnummer as required (Påkrevd toggled on).
2. In a RepeatingGroup, add an OrganisationLookup component bound to EngasjerteVirksomheter.Organisasjonsnummer:
```json
// Example
{
"id": "EngasjerteVirksomheterOrganisationLookup",
"type": "OrganisationLookup",
"dataModelBindings": {
"organisation_lookup_orgnr": {
"field": "EngasjerteVirksomheter.Organisasjonsnummer",
"dataType": "skjema"
}
}
}
```
3. The RepeatingGroup has "validateOnSaveRow": ["Required"] configured.
4. Add a row to the repeating group and attempt to save/submit without entering an organisation number.
## Expected behavior
Validation should prevent the user from saving the row and/or submitting the form, showing a required-field error on the OrganisationLookup component.
## Actual behavior
No required validation error is shown. The user can save the row and submit the form with Organisasjonsnummer empty.
### Additional Information
Repository: https://altinn.studio/repos/dat/forhandsmelding
Component: OrganisationLookup (altinn-app-frontend)
Contributor guide
Research direction
Start at the OrganisationLookup component in the altinn-app-frontend TypeScript/React code and trace how its dataModelBindings field participates in the RepeatingGroup validateOnSaveRow Required path. Reproduce the supplied binding and configuration; done means an empty organisation number shows a required-field error and blocks saving the row or submitting the form.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 63/100