Dyrecteddyrected
Admin UI

Spreadsheet View

Edit multiple records at once from the collection list — inline in the cell, or via an anchored popover — without opening individual edit forms.

Every collection list in the Admin UI has two layout modes: the default List View for browsing and filtering, and Spreadsheet View for bulk editing. Spreadsheet View renders your collection as a grid where you can edit fields directly in place — no page navigation required.


Activating spreadsheet view

Open the column-settings popover in the top-right corner of any collection list. Under Layout Mode, click Spreadsheet. The preference is saved per user and per collection, so switching back to List View at any time is non-destructive.

The grid renders all fields defined on the collection, in definition order, with the same column visibility and ordering you configured in List View.


Editing cells

Different field types commit their changes in different ways.

Inline fields

These fields are edited directly inside the cell — no popover opens:

Field typeBehaviour
text, email, urlClick the cell and type. Commits on blur.
numberClick the cell and type. Commits on blur.
booleanClick the checkbox to toggle. Commits immediately.
date, datetime, timeClick the cell to open the native date/time picker inline. Commits on change.

Popover fields

Clicking a cell opens a small popover anchored to that cell. Press Escape to discard changes and close without saving. Clicking outside commits the current value for text-like fields.

Field typePopover contents
textareaResizable textarea. Commits on blur (click outside). Escape discards.
jsonJSON editor. Commits on blur. Escape discards.
select, radioScrollable option list. Commits immediately on selection.
multiSelectCheckable option list. Each toggle commits immediately.
relationshipRelationship picker. Commits immediately on selection.
imageMedia picker. Commits immediately on selection.
iconIcon picker. Commits immediately on selection.
objectInline form with all sub-fields rendered using the same field components as the main edit form. Commits on blur.
arrayPer-item sub-form with Add and Remove controls. Commits on blur.

Rich text

Clicking a richText cell opens a slide-out side panel with the full rich-text editor. Changes commit when you close the panel. Closing without editing leaves the original value unchanged.


Pending changes

Edits are held locally until you explicitly save or discard them. A floating bar appears at the bottom of the grid whenever there are unsaved changes, showing a count of modified and newly added records.

ActionWhat happens
Save ChangesSends all pending updates and new-row creates to the API in parallel. Clears the pending state on success.
DiscardReverts all unsaved changes, including new rows.

Navigating away while there are pending changes does not warn you — save before leaving.


Adding rows

Click the + Add row button at the bottom of the grid to append a new empty row. New rows appear immediately in the grid and grow the grid height without scrolling. They are included in the pending-changes count and created via the collection's create API endpoint when you save.


Field visibility

Spreadsheet View respects the same admin.hidden flag used by the main edit form. Fields marked hidden: true are excluded from the grid.

blocks fields are also excluded — their polymorphic structure cannot be meaningfully collapsed into a single cell. To edit block content, open the individual document in the edit form.

Fields marked admin.readOnly: true are rendered in the grid but cannot be edited.


Keyboard navigation

react-datasheet-grid (the underlying grid library) supports standard spreadsheet keyboard controls:

KeyAction
Tab / Shift+TabMove to the next / previous cell
EnterConfirm edit and move down
EscapeCancel edit and close popover
Delete / BackspaceClear the cell value
Arrow keysNavigate between cells
Ctrl+C / Cmd+CCopy cell value
Ctrl+V / Cmd+VPaste into selected cell

On this page