marmelab/react-admin · error · Error

If you're not wrapping the RadioButtonGroupInput inside a Re

Error message

If you're not wrapping the RadioButtonGroupInput inside a ReferenceArrayInput, you must provide the choices prop

What it means

RadioButtonGroupInput needs choices to render its radio options. If the component is not pending and there is no fetch error but the resolved choices (props or reference context) are still undefined, it throws instead of rendering nothing, to surface the misconfiguration explicitly.

Source

Thrown at packages/ra-ui-materialui/src/input/RadioButtonGroupInput.tsx:164

        source,
        isFromReference,
    } = useChoicesContext({
        choices: choicesProp,
        isFetching: isFetchingProp,
        isLoading: isLoadingProp,
        isPending: isPendingProp,
        resource: resourceProp,
        source: sourceProp,
    });

    if (source === undefined) {
        throw new Error(
            `If you're not wrapping the RadioButtonGroupInput inside a ReferenceArrayInput, you must provide the source prop`
        );
    }

    if (!isPending && !fetchError && allChoices === undefined) {
        throw new Error(
            `If you're not wrapping the RadioButtonGroupInput inside a ReferenceArrayInput, you must provide the choices prop`
        );
    }

    const { id, isRequired, fieldState, field } = useInput({
        format,
        onBlur,
        onChange,
        parse,
        resource,
        source,
        validate,
        disabled,
        readOnly,
        ...rest,
    });

    const getRecordRepresentation = useGetRecordRepresentation(resource);

View on GitHub (pinned to 051f511bb0)

Solutions

1. Pass a choices array: <RadioButtonGroupInput source="gender" choices={[{id:'m',name:'Male'}]} />
2. Use a ReferenceInput so choices are loaded from the referenced resource
3. Default computed choices to [] to guarantee a defined array

Example fix

// before
<RadioButtonGroupInput source="gender" choices={maybeChoices} />
// after
<RadioButtonGroupInput source="gender" choices={maybeChoices ?? []} />

if (!isPending && !fetchError && !Array.isArray(allChoices)) {
  throw new Error('RadioButtonGroupInput requires a defined choices array');
}

const hasChoices = (
  p: RadioButtonGroupInputProps
): p is RadioButtonGroupInputProps & { choices: any[] } =>
  Array.isArray(p.choices);

try {
  render(<RadioButtonGroupInput source="gender" choices={maybeChoices} />);
} catch (e) {
  if (e.message.includes('must provide the choices prop')) {
    render(<RadioButtonGroupInput source="gender" choices={[]} />);
  }
}

When it happens

Trigger: Standalone RadioButtonGroupInput with source but no choices prop; or a ReferenceInput parent whose resolved choices are undefined once loading finished without an error state.

Common situations: Forgetting the choices prop on a standalone input, custom data loading returning undefined instead of [], or a reference query resolving with undefined data while isPending is false.

Related errors

• If you're not wrapping the RadioButtonGroupInput inside a Re
• useReferenceFieldController: missing reference prop. You mus
• useShowController requires an id prop or a route with an /:i
• useNextPrevController was called outside of a ResourceContex
• To create a new option, you must pass an onCreate function o

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