Johnrey
Johnrey

Reputation: 23

How to disable past date?

How can i disable past date with my codes with real time?

<div class="form-group">
     <label>Check-In</label>
     <input name="cin" type ="date" class="form-control">

 </div>
 <div class="form-group">
     <label>Check-Out</label>
     <input name="cout" type ="date" class="form-control">

 </div>

Upvotes: 1

Views: 98

Answers (1)

Jack Bashford
Jack Bashford

Reputation: 44087

You can make it disallow any previous date by using JavaScript a little bit and the min attribute:

let [today] = new Date().toISOString().split("T");
document.querySelector("input").setAttribute("min", today);
<input name="cin" type ="date" class="form-control">

This will update automatically. If you don't want to allow any checkins earlier than a fixed date (let's say New Year's Day 2019) then just set the min attribute manually:

<input name="cin" type ="date" class="form-control" min="2019-01-01">

Upvotes: 2

Related Questions