marmelab/react-admin · error · Error

SimpleFormIteratorItem must be used in a RecordContextProvid

Error message

SimpleFormIteratorItem must be used in a RecordContextProvider.

What it means

<SimpleFormIteratorItem> represents one row of an array input and reads that row's record from RecordContext. If no record is provided via RecordContextProvider, the row has no data to operate on, so it throws.

Source

Thrown at packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIteratorItem.tsx:34

export const SimpleFormIteratorItem = memo(
    forwardRef<HTMLLIElement, SimpleFormIteratorItemProps>(
        function SimpleFormIteratorItem(props, ref) {
            const {
                children,
                disabled,
                disableReordering,
                disableRemove,
                getItemLabel,
                index,
                inline,
                removeButton = <DefaultRemoveItemButton />,
                reOrderButtons = <DefaultReOrderButtons />,
            } = props;

            const record = useRecordContext(props);
            if (!record) {
                throw new Error(
                    'SimpleFormIteratorItem must be used in a RecordContextProvider.'
                );
            }

            // Returns a boolean to indicate whether to disable the remove button for certain fields.
            // If disableRemove is a function, then call the function with the current record to
            // determining if the button should be disabled. Otherwise, use a boolean property that
            // enables or disables the button for all of the fields.
            const disableRemoveField = (record: RaRecord) => {
                if (typeof disableRemove === 'boolean') {
                    return disableRemove;
                }
                return disableRemove && disableRemove(record);
            };

            const label =
                typeof getItemLabel === 'function'
                    ? getItemLabel(index)

View on GitHub (pinned to 051f511bb0)

Solutions

  1. Wrap each item in a RecordContextProvider: `<RecordContextProvider value={record}><SimpleFormIteratorItem ... /></RecordContextProvider>`.
  2. Render items through <SimpleFormIterator>, which supplies the record context automatically.
  3. If building a custom iterator, provide the item's record (fields value + index) to the context.

Example fix

// before
<SimpleFormIteratorItem index={i} removeButton={...} />

// after
<RecordContextProvider value={record}>
  <SimpleFormIteratorItem index={i} removeButton={...} />
</RecordContextProvider>
Defensive patterns

Strategy: validation

Validate before calling

if (!record) return null; // skip rendering item until RecordContext is available

Type guard

const hasItemRecord = (p: { record?: RaRecord }): p is typeof p & { record: RaRecord } => p.record != null;

Prevention

When it happens

Trigger: Rendering <SimpleFormIteratorItem> manually without wrapping it in <RecordContextProvider value={record}>; using a custom iterator body that renders items directly instead of through SimpleFormIterator.

Common situations: Building a custom array iterator that reuses SimpleFormIteratorItem but forgets to supply the per-item record context; customizing SimpleFormIterator by cloning its internals.

Related errors


AI-assisted analysis of marmelab/react-admin@051f511bb0 (2026-08-30). Data as JSON: /api/errors/f09fa5185f78c0f6. Report an issue: GitHub.