Selectores de Fecha / Hora
Los selectores de fecha y hora proporcionan una forma simple de seleccionar un solo valor de un conjunto predeterminado.
- En móvil, los selectores son los más adecuados para despliegue en diálogos de confirmación.
- Para despliegue en línea, como en un formulario, considere usar controles compactos tales como los botones desplegables segmentados.
mm/dd/yyyy
Selectores nativos
⚠️ Los controles de entrada nativos compatibles con los navegadores no son perfectos.
Date picker
Un ejemplo del selector de fecha nativo con type="date"
.
<form noValidate>
<TextField
id="date"
label="Birthday"
type="date"
defaultValue="2017-05-24"
sx={{ width: 220 }}
InputLabelProps={{
shrink: true,
}}
/>
</form>
<form noValidate>
<TextField
id="datetime-local"
label="Next appointment"
type="datetime-local"
defaultValue="2017-05-24T10:30"
sx={{ width: 250 }}
InputLabelProps={{
shrink: true,
}}
/>
</form>
<form noValidate>
<TextField
id="time"
label="Alarm clock"
type="time"
defaultValue="07:30"
InputLabelProps={{
shrink: true,
}}
inputProps={{
step: 300, // 5 min
}}
sx={{ width: 150 }}
/>
</form>