Question

使用jQuery / jQueryUI datepicker，如何设置在[上述] datepicker上有数据绑定的knockout observable的日期格式？

我已经使用以下方式设置了格式：

<input type="text" data-bind="datepicker: ExampleDate, datepickerOptions: { datePattern: 'DD-MM-YYYY', .... }" />

但这并没有反映出淘汰赛的变数。日期仍然是后端无法解释的JavaScript格式，如C＃.Net。

Answer 1

为datepicker创建淘汰赛自定义绑定将允许此日期格式化。

修改此答案（修复“changeDate”错误并添加可观察的设置器）https://stackoverflow.com/a/6613255/712700，以下内容将执行此操作：

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

        $el.datepicker(options);

        //handle the field changing by registering datepicker's changeDate event
        ko.utils.registerEventHandler(element, "change", function () {
            var observable = valueAccessor();
            observable($el.datepicker("getDate"));
        });

        //handle disposal (if KO removes by the template binding)
        ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
            $el.datepicker("destroy");
        });
        var dateValue = $el && $el.length > 0 ? $el[0].value : undefined;
        if (dateValue) {
            valueAccessor()(dateValue);
        }
    },
    update: function (element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor()),
            $el = $(element);

        //handle date data coming via json from Microsoft
        if (String(value).indexOf('/Date(') == 0) {
            value = new Date(parseInt(value.replace(/\/Date\((.*?)\)\//gi, "$1")));
        }

        var current = $el.datepicker("getDate");

        if (value - current !== 0) {
            $el.datepicker("setDate", value);
        }
        var dateValue = $el && $el.length > 0 ? $el[0].value : undefined;
        if (dateValue) {
            valueAccessor()(dateValue);
        }
    }
};

设置挖掘可观察的部分是：

var dateValue = $el && $el.length > 0 ? $el[0].value : undefined;
if (dateValue) {
   valueAccessor()(dateValue);
}

另请注意，如果您使用的是C＃.Net，并且有一些日期（最初）从后端进入JS域，您可以在此时格式化日期，以便它不会成为JavaScript日期，而是如果你碰巧把它传回去，它将是一个友好的后端将接受。这就是你为Newtonsoft做的事情：

var backendSerialisedModel = @Html.Raw(Newtonsoft.Json.JsonConvert.SerializeObject(Model, new Newtonsoft.Json.Converters.IsoDateTimeConverter() { DateTimeFormat = "dd-MM-yyyy" }));

jQuery datepicker，设置knockout observable的日期格式

1 个答案: