Calendar validation for previous date

Question

I need to be able to add a validation (alertbox) if the user selects a previous date from the calendar.

Today's date is 13/11/2015. If the user was to select 12/11/2015 it should display an alert box saying "Please enter a valid date."

I've looked online and can't seem to find anything to do with this.

Can this be done with javascript?

<input type="date" id="leaveDate">
<script>
     alert("Please enter a valid date.");
</script>

A simple Google search brought me this: http://stackoverflow.com/questions/8305259/check-if-date-is-in-the-past-javascript — Uilian, Nov 13 '15 at 13:40

Karthik RP · Answer 1 · 2015-11-13T19:28:11.357

1

Considering you want a solution in javascript, here is something you can try with onchange function.

<input type='date' onchange="validateDate()" id='mydate'></input>

<script>
function validateDate() {
    var userdate = new Date(document.getElementById("mydate").value).toJSON().slice(0,10);
    var today = new Date().toJSON().slice(0,10);
    if(userdate < today){
      alert('Your message');
    }
}
</script>

PS: Replace 'Your message' with the text you want to display.

edited Nov 13 '15 at 19:28

answered Nov 13 '15 at 13:54

Karthik RP

1,028
16
26

When i select todays date. it gives me an alert box? why? – Imraanstack2 Nov 13 '15 at 15:36
Oops..!! Thats because my solution is comparing current date and time rather than just date. Let me update the solution. – Karthik RP Nov 13 '15 at 19:23

score 0 · Answer 2 · edited May 23 '17 at 12:23

0

If you dont want the user to select the past dates then I would suggest you to disable it like this using the datepicker:

$("#mydate").datepicker({ minDate: 0 });

However if you are intended to do the alert message approach then the thread: Check if date is in the past Javascript is doing what you are looking for.

edited May 23 '17 at 12:23

Community

1
1

answered Nov 13 '15 at 13:40

Rahul Tripathi

168,305
31
280
331

Downvoter, please care to leave a comment! :) – Rahul Tripathi Nov 13 '15 at 13:45
it should display an alert box saying "Please enter a valid date." . not what OP asked :/ – Hacketo Nov 13 '15 at 13:47
@Hacketo:- I am aware of what OP has asked for. Infact thats why I answered by saying `If you dont want the user to select the past dates` since alert message is just to restrict user from entering the past dates. Using alert seems not very productive to me. – Rahul Tripathi Nov 13 '15 at 13:49
I also downvoted for educational purposes, sorry . – Hacketo Nov 13 '15 at 13:58

Calendar validation for previous date

2 Answers2