How do I simulate placeholder functionality on input date field?

Question

It\'s impossible to use placeholder on date fields but I really need it.

I want two date inputs with texts \"From\" and \"To\" on each one as placeholders.

Answer 1

use this input attribute events

onfocus="(this.type='date')" onblur="(this.type='text')"

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

<div class="container mt-3">
  <label for="date">Date : </label>
  <input placeholder="Your Date" class="form-control" type="text" onfocus="(this.type='date')" onblur="(this.type='text')" id="date">
</div>

Answer 2

You can do something like this:

<input onfocus="(this.type='date')" class="js-form-control" placeholder="Enter Date">