Disable future dates in jQuery UI Datepicker
Asked Answered
S

9

77

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.

Shapeless answered 23/10, 2010 at 6:16 Comment(0)
C
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) });
Cribriform answered 23/10, 2010 at 6:20 Comment(1)
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.Woolsack
S
38
$(function() { $("#datepicker").datepicker({  maxDate: '0'}); });
Sacrifice answered 23/10, 2010 at 6:22 Comment(2)
We can use with out single quotes also for ex: maxDate: 0Greisen
nice. I needed this for Date of Death. End user kept predicting the death of people.Discomfort
O
14

Try This:

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

It will disable the future date.

Otha answered 17/7, 2017 at 12:40 Comment(1)
endDate works, maxDate doesn't work for me, thanks @pankajPound
B
4

you can use the following.

$("#selector").datepicker({
    maxDate: 0
});
Brunhild answered 28/2, 2017 at 10:29 Comment(0)
A
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',''); 
Angulo answered 9/11, 2012 at 6:55 Comment(1)
Welcome to Stack Overflow! please avoid putting words in Caps and bold unless they are very important.Heavenward
C
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

Complacency answered 28/10, 2013 at 10:57 Comment(1)
link can be visited for further datepicker parameters.Complacency
S
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',
});
Subadar answered 7/10, 2015 at 13:52 Comment(0)
L
0

Yes, datepicker supports max date property.

 $("#datepickeraddcustomer").datepicker({  
             dateFormat: "yy-mm-dd",  
             maxDate: new Date()  
        });
Lyse answered 12/12, 2015 at 6:56 Comment(1)
How is your answer different than the currently accepted one?Altazimuth
M
-2
$('#thedate,#dateid').datepicker({
     changeMonth:true,
         changeYear:true,
         yearRange:"-100:+0",
         dateFormat:"dd/mm/yy" ,
         maxDate: '0',
     });
});
Misogamy answered 20/4, 2016 at 13:16 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.