Skip to main content

SchemaReferenceInput

Selects one related record through an autocomplete backed by the referenced resource.

Choices are fetched only once the input is focused, so a form with many reference inputs does not fire a request per field on mount.

Example​

<SchemaReferenceInput source="category" reference="eshop/category" />

Props​

NameTypeDefaultDescription
source (required)string—Name of the field in the form record
referencestringresource from contextTarget resource, e.g. "eshop/category"
labelstring | ReactElement | falselabel from the schemafalse hides the label
validateValidator | Validator[]from the schemaReact Admin validators
defaultValueunknownfrom the schemaInitial value in a create form
options.relationRelationFieldOptionsfrom the schemaSee the table below

options.relation​

OptionTypeDefaultDescription
filters{name, value}[]—Restricts the autocomplete results, e.g. only active categories
sortSortPayloadresource defaultOrders the autocomplete results
showCreateButtonbooleanfalseAdds a button that creates a related record in a dialog
showEditButtonbooleanfalseAdds a button that edits the selected record in a dialog
caution

When the reference cannot be resolved — neither the schema nor the resource context supplies one — the component degrades to a plain text input on the raw key instead of failing. That silence is easy to miss in review; check that the reference resolves.

Picking from a hierarchy: TreeArrayInput​

An array reference whose items use format: "tree-relation" renders as TreeArrayInput — a checkbox tree instead of an autocomplete. Use it when the choices form a hierarchy the user needs to see while picking: a category tree, an organisational unit.

NameTypeDefaultDescription
parentstring'parent'Field of the referenced record holding its parent's id
labelstring | ReactElement | falselabel from the schemafalse hides the label

useTreeChoices loads the referenced records through useGetAll — in batches of 50, walking every page — and maps each one to {id, name, parentId}; TreeSelect materialises the hierarchy from that and expands every node (expand="all" on the input; the read-only TreeArrayField expands only the branches that hold a selected value).

caution

The whole referenced resource is fetched before the tree renders, one request per 50 records. That is fine for a category tree and wrong for a large table — reach for a plain relation autocomplete there, which pages as the user types.

Schema mapping​

format: "relation" or "tree-relation" with a reference:

{"name": "category", "type": "integer", "format": "relation",
"reference": "eshop/category",
"options": {"relation": {"showCreateButton": true,
"filters": [{"name": "is_active", "value": true}]}}}
from habarico import ModelAdmin
from habarico.schema import Field
from habarico.schema.fields import RelationOptions


class ProductAdmin(ModelAdmin):
model = Product
fields = [
"id",
"name",
Field(name="category", relation=RelationOptions(show_create_button=True)),
]

See also​