Master Detail
On desktop the list narrows to the left and the selected row fills a panel on the right. Below desktop there is no room for a panel, so a row opens the item instead.
Best for: Reviewing items one after another without leaving the list.
Two parts to paste. The Screen YAML and the App.Formulas. The formulas are the same for all ten patterns, so an app with several of them needs that block once. Without it the screen has no colours, sizes or sample rows — or download the .msapp to skip the paste.
Preview and code
Wireframe — screenshots coming soon
Detail panel
Every field of the selected row
Selection tint
The selected row is marked
No extra query
The panel reads the gallery's own selection
Responsive
A row opens the item below desktop
Sortable headers
Click a header to sort the list, as on Read Only
How it works
The 2 techniques that make this pattern work on a list big enough to matter.
The panel costs no query
It reads galTmdRows.Selected, which already holds every column of the row. A detail that needs a child list would add one delegable Filter on the item key.
With({ r: galTmdRows.Selected }, Table(
{ FieldLabel: "Owner", FieldValue: r.Owner }, ...))A template cannot read its own gallery's AllItems
The selected tint uses ThisItem.IsSelected and Select(Parent), not a lookup into the gallery.
Connect to SharePoint
It ships on sample rows. The queries are already written the way SharePoint needs, so switching is a rename rather than a rewrite.
- Add your list as a data source.
- In
galTmdRows.Items, replacecolTblItemswith your list (the src: Filter(colTblItems, ...) inside the With). - Delete
nfSeedTblItems();from the screen’s OnVisible. - If your columns are named differently, rename them in the screen, or add matching columns to the list.
- Index these columns:
Title,ItemKey,StatusKey,CategoryKey,Owner,Amount,DueDate.
The columns the patterns read
| Column | Type | Used for |
|---|---|---|
| Title | Text | The item's name; searched and sorted |
| ItemKey | Text | A unique reference, e.g. ITM-0042; searched, and the selection key |
| Owner | Text | Who the item belongs to |
| OwnerEmail | Text | The owner's email |
| StatusKey | Text | NotStarted, InProgress, OnHold or Completed |
| CategoryKey | Text | A key from nfTblCategories |
| PriorityKey | Text | High, Medium or Low |
| Amount | Number | A money value |
| DueDate | Date | When it is due; overdue rows turn red |
| Created | Date and time | Built in on a SharePoint list |
Rules that keep it working past 5,000 rows
- Every filter on a growing list must delegate: equality on an indexed column, StartsWith on text, and And or Or of those. in, Search() and <> do not delegate on SharePoint.
- An "All" choice must send no condition. Put the If outside the Filter and test the key with IsBlank, never with = "": a blank key compared with a column filters on blank and returns nothing.
- Sort with one literal SortByColumns per column. A column name held in a variable does not delegate.
- Index every column you filter or sort on before the list passes 5,000 items. Past that, SharePoint refuses an unindexed filter or sort outright.
- CountRows, Sum and Average do not delegate. Show rows loaded rather than a total, or keep totals in a list a scheduled flow maintains.
Get new components and templates when they drop
One email when something new ships. Unsubscribe anytime.
Community
Use the toolbar to format · or type markdown directly