I "may" be missing something. I can change the datepicker values when I update the model manually (via console), but when the datepicker itself is changed, it does not update the model. I can work around this by setting the model value in the onSelect event. But, it seems that this should be unnecessary.
<script>
var model= function(data){
var self = this;
self.checkInDate = ko.observable(data.CheckInDate);
self.checkOutDate = ko.observable(data.CheckOutDate);
}
</script>
<div id="checkIn" data-bind="datepicker: {
value: checkInDate,
minDate: '+2w',
showOtherMonths: true,
selectOtherMonths: true,
changeYear: true,
changeMonth: true,
onSelect: function (selectedDate) {
$('#checkOut').datepicker('option', 'minDate', selectedDate);
}
}"></div>
<div id="checkOut" data-bind="datepicker: {
value: checkOutDate,
minDate: '+15d',
showOtherMonths: true,
selectOtherMonths: true,
maxDate: '+12M',
changeMonth: true,
onSelect: function (selectedDate) {
$('#checkIn').datepicker('option', 'maxDate', selectedDate);
}
}">
Let me know if there are any incompatibilities, missing elements, or if this is a bug.