Related Items

Subgrid of related items from another list, linked via a foreign key.

Widget description: relatedItems

The widget displays a table of items from another list that belong to the current item (1:N relationship), such as project tasks or order lines. The link is defined by a foreign key—a column in the target list whose value matches the key of the current item. It is a virtual widget: data remains in the target list and nothing is saved to the current item. A similar widget for files is Related Documents.

Related Items widget settings in the inspector: target list, source key, foreign key column, and displayed columns

Adding to the form

  1. On the Widgets tab in the left palette, select Related Items (subtitle “Widget · 1:N records”) and drag it into a section, or click “+”.
  2. In the inspector, select the Target list. Site lists are offered (standard lists, not libraries).
  3. Select the Foreign key column in target list.
  4. Check the Displayed columns in table and rename them if needed.

Until a list and a foreign key column are selected, the widget displays “Widget is not fully configured” in the form.

Inspector settings

OptionPropertyDescriptionDefault
Target listtargetListId, targetListTitleList from which items are read. Changing the list resets the foreign key column, displayed columns, link, and sorting.not selected
Source key in this formsourceKeyField@itemId (ID of the current item) or the internal name of a form field whose value is matched against the foreign key. See Key and foreign key.@itemId
Foreign key column in target listforeignKeyFieldColumn in the target list used for filtering.not selected
Displayed columns in tableviewFieldsTable columns. The Available columns block (with search) is used to check columns; a column is appended to the end. Each row in the Displayed columns block has ordering (drag-and-drop or arrows), custom label (columnLabels), cell formatting, and a remove icon. The last remaining column cannot be removed.["Title"]
Column linking to item detaillinkToItemFieldWhich displayed column acts as a link. Clicking opens the item detail in a dialog. Without a link, it is plain text.no link
Default table sortingdefaultSortField, defaultSortDirectionColumn and direction (asc ascending A–Z, desc descending Z–A) when opened.no sort, asc
Enable quick search / filter in tableenableSearchShows a “Filter items…” input above the table.yes
Enable “+ New item” buttonallowAddNewAdds a New item button to the header.no
Custom labelcustomLabelWidget title. If omitted, the target list title is used, otherwise “Related Items”.“Related Items”
Width in section, Visible, Read-onlycolSpan, defaultVisible, defaultReadOnlyCommon options. Read-only hides the New item button.12, yes, no

Displayed columns of type Person and Lookup (including multi-value) added manually in configuration or via AI are loaded using $expand and displayed as text (person name, lookup value, comma-separated for multiple values). Previously, such columns resulted in an HTTP 400 error. Audit columns (Created By, Modified By, Created, Modified, ID, Attachments) are at the bottom of the list under the “System columns” divider.

The displayed columns picker includes text, choice, number, lookup (including multi-value), person (including multi-value), date, yes/no, and counter columns; technical and hidden columns are omitted, and the column type is shown after the name. The foreign key column picker remains limited to the default set of columns. The number of loaded rows (rowLimit, 1 to 100, default 25 for a new widget) is set in the inspector under “Maximum number of records” (clamped to 1–100).

Visual column formatting

In the large widget configuration dialog (Columns tab), under Displayed columns, you can choose a Format for each column directly in its row (the arrow at the end of the row expands details; one row is expanded at a time). Settings are stored in columnFormatting keyed by the column's internal name. Without a format, or when the value does not fit the format (for example text in a progress bar), plain text is shown. You can inspect the result in the preview at the bottom of the dialog: open it with Show preview and refresh it after further edits with Refresh preview (until refreshed, a notice warns that it does not reflect the latest changes).

FormatOptionsBehavior
badge BadgebadgeOptions (value, color, icon), defaultColorColored badge with visible text. Value rows are pre-populated from column choices, or can be added manually. Multi-value choices render a set of badges. Colors are named only (blue, green, yellow, red, theme, gray), no custom HEX.
progressBar Progress barmax, maxField, showValue, unit, colorHorizontal bar with number and unit. The maximum is taken from a column in the same row (maxField), otherwise fixed max, otherwise 100.
dateAlert Due datehighlightPastDue (default yes), daysAheadWarning, statusField + neutralIfStatusInOverdue dates are red with “Past due”, upcoming dates are yellow with “Due soon”. If the row's status is in the neutral status list, no warning is shown. Today is compared by calendar day without time-zone shift.
persona PersonshowEmailActionName with an initials avatar (no photo) and an optional mailto: link to the person's email.

Columns referenced as maxField or statusField are loaded even when they are not displayed in the table.

Related items filter

On the Filter tab of the large configuration dialog, you can add extra conditions to the item link, such as showing only active items or only your own items.

Expert mode: the Direct OData expression toggle reveals a text box for a custom OData fragment (for example Stav eq 'Done'). It is combined via AND with both the visual filter and the item link. Intended for designers only; the expression is not validated—do not insert user-entered values into it.

For lists with more than 5,000 items, columns used in the filter must also be indexed, otherwise SharePoint will reject the query (see below).

Key and foreign key

The widget queries the target list for items where foreign key column = source key value. The source key is either the current item's ID (@itemId, most common) or the value of another form field (for example Zakazka, in which case the item does not need to be saved first). The widget detects the foreign key column type automatically and builds the appropriate filter:

Foreign key column typeComparison
Lookup (Lookup), including multi-value, Personby selected item ID (ColumnId = n)
Number, Counter, Integer, Currencynumeric equality (Column = n)
Text, Choicestring equality (Column = 'n')
Unrecognized typetries all three methods in sequence

A key value from a lookup, person, or metadata field is converted to an ID (for person and lookup) or a term identifier. When the key is ID, filtering is performed directly by ID.

Unindexed foreign key column (5,000-item threshold)

SharePoint refuses to filter a list with more than 5,000 items by an unindexed column (List View Threshold). The widget prevents this:

Warning in the inspector “Column … is not indexed” with the Index column button below the foreign key column picker

For large lists, index the foreign key column in advance (List settings, Indexed columns), or use the button in the designer.

Runtime behavior

Widget in Edit mode: header with count and buttons, filter, table with renamed columns, link in the first column, and sort arrow
Widget in New mode showing “Related records will be available after the item is saved for the first time”

Text translations

The title (customLabel) and column labels (columnLabels, keyed by internal column name) can be translated. Built-in widget UI text (filter, buttons, messages) switches automatically with the form language. See Translations and Multilingual Forms.

Rules and scripts

Configuration example (JSON)

{
  "internalName": "widget_related_ukoly",
  "customLabel": "Project tasks",
  "fieldType": "relatedItems",
  "colSpan": 12,
  "defaultVisible": true,
  "relatedItemsConfig": {
    "targetListId": "00000000-0000-0000-0000-000000000000",
    "targetListTitle": "Tasks",
    "foreignKeyField": "Projekt",
    "sourceKeyField": "@itemId",
    "viewFields": ["Title", "Stav", "Termin"],
    "columnLabels": { "Title": "Task", "Stav": "Status", "Termin": "Due date" },
    "linkToItemField": "Title",
    "defaultSortField": "Termin",
    "defaultSortDirection": "asc",
    "enableSearch": true,
    "rowLimit": 25,
    "allowAddNew": true
  }
}

targetListId expects the list identifier (GUID). In the designer you pick it from a list; only enter it manually when writing JSON.

Limitations and tips