Marco Marco - 6 months ago 87
jQuery Question

Foundation datepicker - disabling future dates

I am using foundation datepicker and I am trying to disable dates. I am able to disable dates for one field, where dates are disabled from week ago, but I am not able to disable dates that are going from now into the future:

onRender: function (date) {
return date.valueOf() > date.valueOf() ? 'disabled' : '';
}


This is the complete code:

var date = new Date();
var weekBack = new Date(new Date(date).setDate(date.getDate() - 7));

$('#datePicker').fdatepicker({
closeButton: false,
initialDate: weekBack,
format: 'dd.mm.yyyy',
onRender: function (date) {
return date.valueOf() > weekBack.valueOf() ? 'disabled' : '';
},
}).on('changeDate', function (ev) {
var dateFrom = $("#datePicker").val().split(".").reverse().join("-");
var dateTo = $("#datePicker1").val().split(".").reverse().join("-");
timelines(dateFrom, dateTo);
barCharts(dateFrom, dateTo);
});

$('#datePicker1').fdatepicker({
closeButton: false,
initialDate: date,
format: 'dd.mm.yyyy',
onRender: function (date) {
return date.valueOf() > date.valueOf() ? 'disabled' : '';
},
}).on('changeDate', function (ev) {
var dateFrom = $("#datePicker").val().split(".").reverse().join("-");
var dateTo = $("#datePicker1").val().split(".").reverse().join("-");
timelines(dateFrom, dateTo);
barCharts(dateFrom, dateTo);
});

Answer

You just set the endDate as following:

var now = new Date();    
$("#birthday").fdatepicker({
                format: "dd M yyyy",
                endDate: now
            });

Conversely, if you want to disable the past days, set the startDate:

var now = new Date();
$("#checkin").fdatepicker({
                format: "dd M yyyy",
                startDate: now
            });

Hope this useful!

Comments