Bind bootstrap datepicker with knockoutjs

knockout.js, twitter-bootstrap

Solution

I found a fiddle that will help me http://jsfiddle.net/jearles/HLVfA/6/

Functionality from the fiddle:

  ko.bindingHandlers.datepicker = {
        init: function (element, valueAccessor, allBindingsAccessor) {
            //initialize datepicker with some optional options
            var options = allBindingsAccessor().datepickerOptions || {};
            $(element).datepicker(options).on("changeDate", function (ev) {
                var observable = valueAccessor();
                observable(ev.date);
            });
        },
        update: function (element, valueAccessor) {
            var value = ko.utils.unwrapObservable(valueAccessor());
            $(element).datepicker("setValue", value);
        }
    };

Problem

I want to use a bootstrap datepicker and to bind the selected date with knockoutjs. the function that uses the datepicker: ``` $(function() { // create the departure date $('#depart-date').datepicker({ autoclose: true, format: 'yyyy/mm/dd', }).on('changeDate', function(ev) { ConfigureReturnDate(); }); $('#return-date').datepicker({ autoclose: true, format: 'yyyy/mm/dd', startDate: $('#depart-date').val() }); // Set the min date on page load ConfigureReturnDate(); // Resets the min date of the return date function ConfigureReturnDate() { $('#return-date').datepicker('setStartDate', $('#depart-date').val()); } }); ``` Here is a fiddle that I want to use but is not sure how to go about doing so. http://jsfiddle.net/zNbUT/276/

Original source