Bootstrap datepicker change minDate/startDate from another datepicker
I have made a jsfiddle doing what you want. As pqdong commented you were calling datetimepicker instead of datepicker when setting end date.
Here is the working javascript:
$(document).ready(function(){
$("#startdate").datepicker({
todayBtn: 1,
autoclose: true,
}).on('changeDate', function (selected) {
var minDate = new Date(selected.date.valueOf());
$('#enddate').datepicker('setStartDate', minDate);
});
$("#enddate").datepicker()
.on('changeDate', function (selected) {
var maxDate = new Date(selected.date.valueOf());
$('#startdate').datepicker('setEndDate', maxDate);
});
});
I don't have enough reputation tocomment on Razzildinho's excellent answer, but did want to offer one small addition that will help users, which is to highlight the selected day on the second datepicker. You can do this by adding this line:
$('#enddate').datepicker('setDate', minDate);
So in context it will look like this:
$(document).ready(function(){
$("#startdate").datepicker({
todayBtn: 1,
autoclose: true,
}).on('changeDate', function (selected) {
var minDate = new Date(selected.date.valueOf());
$('#enddate').datepicker('setStartDate', minDate);
$('#enddate').datepicker('setDate', minDate); // <--THIS IS THE LINE ADDED
});
$("#enddate").datepicker()
.on('changeDate', function (selected) {
var maxDate = new Date(selected.date.valueOf());
$('#startdate').datepicker('setEndDate', maxDate);
});
});