Page History
(this page was created automatically. In case of formatting issues, please visit the official Wiki Page)
Lookup Input
Link to Figma: tba
Overview
- The Lookup Input Component is a specialized form control for searching and selecting items from large datasets.
- It displays a read-only input field that opens a dialog with a searchable data grid when clicked.
- The component is useful when traditional dropdowns are impractical due to the dataset size.
- It improves efficiency by combining search, selection, and data persistence in one control.
...
| Do | Don’t | Article setting(s) | |||
|---|---|---|---|---|---|
| Store a stable ID and show a readable name. | Store the display name as the value. | valueKey, displayValueKey, dataField | |||
| Localize label, dialog title, and subtitle. | Ship English-only strings. | labelTranslations, dialogTitleTranslations, dialogSubtitleTranslations | |||
| Keep the grid focused on decisive fields. | Show every backend column. | elements | |||
| Use pagination for large datasets. | Load thousands of rows at once. | enablePagination, pageSize | |||
| Persist frequent selections across sessions. | Force users to reselect on every visit. | saveInLocalStorage | |||
| Mark essential relationships as required. | Let forms submit with missing relations. | validation.required | |||
| Respect permissions by disabling interaction. | Hide the control when users need to see the value. | authorizationDisable | |||
| Hide the field when irrelevant. | Show an inert field with no purpose. | hidden | Pre-configure query parameters on init. | Change server filters unpredictably mid-session. | ON_INIT, getEntityCollectionHttpRequestParametersMap |
| Submit data through the intended channel. | Rely on defaults that mismatch your API. | controlsRequestType, dataField | |||
| Provide a stable test hook for QA. | Select the control via brittle selectors. | dataTestId | |||
| Set a safe, obvious default only when appropriate. | Pre-fill with a misleading value. | defaultValue |
...
