quickstep25
11/27/2014 - 9:46 PM

DateRangePicker - Knockout

DateRangePicker - Knockout


ko.bindingHandlers.daterangepicker = {
  _defaultStart: function() {
    return moment().add('months', 1).startOf('month').toDate();
  },

  _defaultEnd: function() {
    return moment().add('months', 1).startOf('month').add('years', 1).subtract('days', 1).toDate();
  },

  _deriveStartDate: function(_options) {
    return ko.utils.unwrapObservable(_options.from) || _defaultStart();
  },

  _deriveEndDate: function(_options) {
    return ko.utils.unwrapObservable(_options.to) || _defaultEnd();
  },

  update: function(elem, acc, all, vm, ctx) {
    var _options = ko.utils.unwrapObservable(acc());
    $(elem).daterangepicker().startDate = _deriveStartDate(_options);
    $(elem).daterangepicker().endDate = _deriveEndDate(_options);
  },

  init: function(elem, acc, all, vm, ctx) {
    var _options = ko.utils.unwrapObservable(acc());

    $(elem).daterangepicker({
      startDate: _deriveStartDate(_options),
      endDate: _deriveEndDate(_options),
      buttonClasses: ['btn-primary']
    }, function(start, end) {
      _options.from(moment.utc(start).format('L'));
      _options.to(moment.utc(end).format('L'));
    });
  }
};