TimeField
Displays a time-of-day value in the active locale.
Use it for a clock time that carries no date — opening hours, a pickup slot. For a full timestamp reach for DateField instead.
Example
<TimeField source="pickup_from" />
// 09:00:00 → "9:00 AM" in en, "9:00" in cs
Props
On top of these it accepts the shared field props.
| Name | Type | Default | Description |
|---|---|---|---|
source (required) | string | — | Name of the field on the record |
locales | string | the admin's active locale | Overrides the locale used for formatting |
sx | SxProps<Theme> | — | MUI style override; the field sets white-space: nowrap by default |
Behaviour
The value is expected as an HH:MM:SS string. It is parsed into hours, minutes and seconds and
formatted with Intl.DateTimeFormat at timeStyle: 'short' — so seconds are not shown even when
the value carries them.
An empty value renders as an empty string. A non-string value is rendered as-is, without formatting.
Schema mapping
The component is picked for format: "time":
{"name": "pickup_from", "type": "string", "format": "time"}
- Python
- Ruby
class Pickup(models.Model):
pickup_from = models.TimeField()
See also
- TimeInput — the form counterpart
- DateField — dates and full timestamps
- FieldSchema — the full shape of a field schema