marmelab/react-admin · error · Error

SimpleFormIterator can only be called within an iterator inp

Error message

SimpleFormIterator can only be called within an iterator input like ArrayInput

What it means

<SimpleFormIterator> renders the rows of an <ArrayInput>; it relies on the iterator context that ArrayInput provides (via useWrappedSource/useArrayInput) to know which array field it manages. Used outside such an input, the wrapped source is empty and it throws.

Source

Thrown at packages/ra-ui-materialui/src/input/ArrayInput/SimpleFormIterator.tsx:60

        addButton = <DefaultAddItemButton />,
        removeButton,
        reOrderButtons,
        children,
        className,
        disabled,
        disableAdd = false,
        disableClear,
        disableRemove = false,
        disableReordering,
        inline,
        getItemLabel = false,
        fullWidth,
        sx,
    } = props;

    const finalSource = useWrappedSource('');
    if (!finalSource) {
        throw new Error(
            'SimpleFormIterator can only be called within an iterator input like ArrayInput'
        );
    }
    const { fields } = useArrayInput(props);
    const record = useRecordContext(props);
    const records = get(record, finalSource);
    const getArrayInputNewItemDefaults =
        useGetArrayInputNewItemDefaults(fields);

    const getItemDefaults = useEvent((item: any = undefined) => {
        if (item != null) return item;
        return getArrayInputNewItemDefaults(children);
    });

    return (
        <SimpleFormIteratorBase getItemDefaults={getItemDefaults} {...props}>
            <Root
                className={clsx(

View on GitHub (pinned to 051f511bb0)

Solutions

  1. Always nest it inside <ArrayInput>: `<ArrayInput source="tags"><SimpleFormIterator><TextField source="name" /></SimpleFormIterator></ArrayInput>`.
  2. For related-record lists use <ReferenceManyField> with its own iterator (e.g. <Datagrid> or <SimpleList>), not SimpleFormIterator.
  3. If you need a custom iterator, build it on the iterator context that ArrayInput provides.

Example fix

// before
<SimpleForm>
  <SimpleFormIterator>
    <TextField source="name" />
  </SimpleFormIterator>
</SimpleForm>

// after
<SimpleForm>
  <ArrayInput source="tags">
    <SimpleFormIterator>
      <TextField source="name" />
    </SimpleFormIterator>
  </ArrayInput>
</SimpleForm>
Defensive patterns

Strategy: validation

Validate before calling

// Ensure SimpleFormIterator is a direct child of ArrayInput
<CheckIteratorParent>{children}</CheckIteratorParent> // or assert useWrappedSource('') returns non-empty in dev

Prevention

When it happens

Trigger: Placing <SimpleFormIterator> directly inside a form (not inside <ArrayInput>); using it inside <ReferenceManyField> or other non-iterator inputs; nesting it outside any input that supplies iterator context.

Common situations: Copy-pasting SimpleFormIterator into a plain SimpleForm; trying to reuse it for ReferenceManyField lists; refactoring forms and accidentally un-nesting it from ArrayInput.

Related errors


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