jQuery datepicker、ノックアウト観測の日付フォーマットを設定する

Question

jQuery/jQueryUIのdatepickerを使用して、上記のdatepickerにデータバインドを持つノックアウトオブザーバブルの日付フォーマットを設定するにはどうすればよいですか？

私はすでに使用して書式を設定しています

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

をしかし、これはノックアウト変数には反映されません。日付はC＃.Netのようにバックエンドで解釈できないJavaScript形式のままです。

Answer 1

datepicker用のノックアウトカスタムバインディングを作成すると、この日付の書式設定が可能になります。 https://stackoverflow.com/a/6613255/712700（「CHANGEDATE」エラーを固定して観察セッターを追加）この回答を修正

、以下にそれを行います。

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" }));