Question

选项＆＃34; startDate＆＃34;来自bootstrap datepicker http://bootstrap-datepicker.readthedocs.org/en/latest/options.html#id6无效。我在模态对话框中使用datepicker来输入日期。

我在模态对话框中使用以下代码：

<input data-bind="datepicker: Task_end , setDate: Task_end, datepickerOptions: { startDate: Task_start , format: 'dd.mm.yyyy', autoclose: 'true', weekStart: 1, todayHighlight:'true', forceParse: false }" />

我想设置＆＃34;最小日期= startDate＆＃34;到＆＃34; Task_start＆＃34;限制选择＆＃34; Task_end＆＃34;小于＆＃34; Task_start＆＃34;。＆＃34; startDate＆＃34;是datepicker中的一个选项，但它不起作用。

我可以选择日期，但只能选择＆＃34; startDate＆＃34;选项不起作用。

在viewmodel中，我对datepicker有以下绑定：

ko.bindingHandlers.datepicker = {
    init: function (element, valueAccessor, allBindingsAccessor) {
        //initialize datepicker with some optional options
        var options = allBindingsAccessor().datepickerOptions || {};
        $(element).datepicker(options);

        //when a user changes the date, update the view model
        ko.utils.registerEventHandler(element, "changeDate", function (event) {
            var value = valueAccessor();
            if (ko.isObservable(value)) {
                value(event.date);
            }
        });
    },
    update: function (element, valueAccessor) {
        var widget = $(element).data("datepicker");
        //when the view model is updated, update the widget
        if (widget) {
            widget.date = ko.utils.unwrapObservable(valueAccessor());
            if (widget.date) {
                widget.setValue();
            }
        }
    }

};

Answer 1

Task_start是Date选项需要startDate吗？如果它位于可观察对象中，则在构建startDate时需要包含datepickerOptions选项的调用括号，因为这不是单符号表达式：

<input data-bind="datepicker: Task_end, datepickerOptions: { startDate: Task_start(), format: 'dd.mm.yyyy' }" />

ko.bindingHandlers.datepicker = {
  init: function(element, valueAccessor, allBindingsAccessor) {
    //initialize datepicker with some optional options
    var options = allBindingsAccessor().datepickerOptions || {};
    $(element).datepicker(options);

    //when a user changes the date, update the view model
    ko.utils.registerEventHandler(element, "changeDate", function(event) {
      var value = valueAccessor();
      if (ko.isObservable(value)) {
        value(event.date);
      }
    });
  },
  update: function(element, valueAccessor) {
    var widget = $(element).data("datepicker");
    //when the view model is updated, update the widget
    if (widget) {
      widget.date = ko.utils.unwrapObservable(valueAccessor());
      if (widget.date) {
        widget.setValue();
      }
    }
  }

};


vm = {
  Task_start: ko.observable(new Date('12-10-2015')),
  Task_end: ko.observable(new Date('12-25-2015'))
};
ko.applyBindings(vm);

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.1/css/bootstrap-datepicker.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.1/js/bootstrap-datepicker.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<input data-bind="datepicker: Task_end, datepickerOptions: { startDate: Task_start(), format: 'dd.mm.yyyy' }" />

knockout bootstrap datepicker startDate无效

1 个答案: