Textfield material ui in 24 hours format

Question

Does anyone know what is the props to make a textfield in material ui to be 24 hour format? I cant seem to find anywhere? here is my current component

                    <TextField
                      type="time"
                      variant="outlined"
                      size="small"
                      name="startTime"
                      value={this.state.startTime}
                      onChange={handleChange}
                    />

This might help https://stackoverflow.com/questions/60086014/how-to-change-material-ui-timepicker-to-24-hour-format — Nooruddin Lakhani, Dec 30 '20 at 08:06

score 0 · Answer 1 · answered Dec 30 '20 at 08:32

0

TextField meant to be used for text, use TimePicker for that purpose

import React, { Fragment, useState } from "react";
import { TimePicker } from "@material-ui/pickers";

function BasicTimePicker() {
  const [selectedDate, handleDateChange] = useState(new Date());

  return (

      <TimePicker
        clearable
        ampm={false}
        label="24 hours"
        value={selectedDate}
        onChange={handleDateChange}
      />
  );
}

export default BasicTimePicker;

answered Dec 30 '20 at 08:32

karzan

31
4

okay thank you just checking thanks for help – Nanda Christanto Dec 30 '20 at 08:51
This requires the installation of multiple additional libraries and a date framework. Are there options that don't require all that extra stuff and change of how to handle Date objects? – lowcrawler Mar 21 '22 at 02:50

Textfield material ui in 24 hours format

1 Answers1