Home > Enterprise >  How to display a calendar instead of textinput to have the date with REACT?
How to display a calendar instead of textinput to have the date with REACT?

Time:05-20

how can I do to have a calendar instead of having a textinput in my form please ??

export default function InterviewSettings() {
  const [date, setDate] = useState("");
  const [msg, setMsg] = useState("");    
  ...    
  return (
    <>
      <form onSubmit={handleSubmit}>
        <label>
          Date:
          <input
            type="text"
            value={date}
            placeholder="DD/MM/YY"
            onChange={(e) => setDate(e.target.value)}
          />
        </label>
      </form>
    </>
  );
}

Here is code

CodePudding user response:

You can simply change the input type from type="text" to HTML5 date type type="date", this should do the trick.

CodePudding user response:

Tou can use input type="date"

<input type="date" id="start" name="trip-start"
       value="2018-07-22"
       min="2018-01-01" max="2018-12-31">

or you can consider 3-rd party libraries for that:

  • Related