Disable future dates in jQuery UI Datepicker

Question

Is it possible to disable future date from today?

Let say today is 23/10/2010, so 24/10/2010 onwards are disabled.

Sorry I am very new in jQuery and JavaScript.

score 128 · Accepted Answer · edited Feb 23 '15 at 19:27

128

Yes, indeed. The datepicker has the maxdate property that you can set when you initialize it.

Here's the codez

$("#datepicker").datepicker({ maxDate: new Date, minDate: new Date(2007, 6, 12) });

edited Feb 23 '15 at 19:27

Satpal

132,252
13
159
168

answered Oct 23 '10 at 06:20

Cyril Gupta

13,505
11
64
87

5

Remember that when setting javascript's `Date` object use month-1. So, Jan is 0 and Dec is 11. This just slipped my mind for a few minutes. – mawburn Aug 22 '13 at 19:38

ArK · Answer 2 · 2012-06-30T05:09:42.440

38

$(function() { $("#datepicker").datepicker({  maxDate: '0'}); });

edited Jun 30 '12 at 05:09

answered Oct 23 '10 at 06:22

ArK

20,698
67
109
136

3

We can use with out single quotes also for ex: `maxDate: 0` – RajeshKdev Apr 29 '13 at 05:52
5

nice. I needed this for Date of Death. End user kept predicting the death of people. – JoshYates1980 Nov 04 '15 at 16:02

score 14 · Answer 3 · answered Jul 17 '17 at 12:40

14

Try This:

$('#datepicker').datepicker({
    endDate: new Date()
});

It will disable the future date.

answered Jul 17 '17 at 12:40

pankaj jain

141
1
2

3

endDate works, maxDate doesn't work for me, thanks @pankaj – bdalina Mar 20 '19 at 03:48

score 4 · Answer 4 · answered Feb 28 '17 at 10:29

4

you can use the following.

$("#selector").datepicker({
    maxDate: 0
});

answered Feb 28 '17 at 10:29

Praddyumna Sangvikar

149
1
2
11

score 3 · Answer 5 · edited Nov 09 '12 at 07:19

3

Code for Future Date only with disable today's date.

 var d = new Date();
         $("#delivdate").datepicker({
         showOn: "button",
         buttonImage: base_url+"images/cal.png",
         minDate:new Date(d.setDate(d.getDate() + 1)),
         buttonImageOnly: true
        });
         $('.ui-datepicker-trigger').attr('title','');

edited Nov 09 '12 at 07:19

Unni Kris

3,081
4
35
57

answered Nov 09 '12 at 06:55

JAY

49
5

4

Welcome to Stack Overflow! please avoid putting words in Caps and bold unless they are very important. – Unni Kris Nov 09 '12 at 07:15

score 3 · Answer 6 · answered Oct 28 '13 at 10:57

3

Date for the future 1 year can be done by

$('.date').datepicker({dateFormat: 'yy-mm-dd', minDate:(0), maxDate:(365)});

you can change the date format too by the parameter dateFormat

answered Oct 28 '13 at 10:57

Abdul Rehman

689
6
11

1

[link](http://jqueryui.com/datepicker/#multiple-calendars) can be visited for further **datepicker** parameters. – Abdul Rehman Oct 28 '13 at 11:00

score 0 · Answer 7 · edited Oct 07 '15 at 14:22

0

http://stefangabos.ro/jquery/zebra-datepicker

use zebra date pickers:

$('#select_month1').Zebra_DatePicker({
  direction: false,
  format: 'Y-m-d',
  pair: $('#select_month2')
});

$('#select_month2').Zebra_DatePicker({
  direction: 1, format: 'Y-m-d',
});

edited Oct 07 '15 at 14:22

al'ein

1,711
1
14
21

answered Oct 07 '15 at 13:52

Bharathi

1

score 0 · Answer 8 · edited Dec 12 '15 at 07:08

0

Yes, datepicker supports max date property.

 $("#datepickeraddcustomer").datepicker({  
             dateFormat: "yy-mm-dd",  
             maxDate: new Date()  
        });

edited Dec 12 '15 at 07:08

Wtower

18,848
11
103
80

answered Dec 12 '15 at 06:56

Gaurav Malik

53
1
11

How is your answer different than the currently accepted one? – Wtower Dec 12 '15 at 07:08

score -2 · Answer 9 · edited Apr 21 '16 at 13:25

-2

$('#thedate,#dateid').datepicker({
     changeMonth:true,
         changeYear:true,
         yearRange:"-100:+0",
         dateFormat:"dd/mm/yy" ,
         maxDate: '0',
     });
});

edited Apr 21 '16 at 13:25

drneel

2,887
5
30
48

answered Apr 20 '16 at 13:16

user6230444

1

Disable future dates in jQuery UI Datepicker

9 Answers9

Linked

Related