Question

有沒有人成功地使用jQuery Mobile DateBox與Knockout.js？

我遇到麻煩的結合提供了選擇日期之前顯示的值時，工作。它仍然是空白的。如果我使用標準文本輸入，則綁定工作正常。

<input id="start" type="date" data-bind="value: start" data-role="datebox" data-options='{"mode": "timeflipbox", "useButton": false, "useFocus": true, "dialogForce" : true, "transition" : "slidedown"}'> 

//In the view model: 
this.start = ko.observable(startTime); 

我已經試過

$('#start').datebox('refresh') 

，但沒有運氣....

Answer 1

我最後寫一個自定義的淘汰賽，這似乎這樣的伎倆結合：

ko.bindingHandlers.jqmDateBox = { 
    update: function (element, valueAccessor, allBindingsAccessor, context) { 
     setTimeout(function() { 
      var value = valueAccessor(); 
      var valueUnwrapped = ko.utils.unwrapObservable(value); 
      $(element).val(valueUnwrapped); 
      $(element).data('datebox').options.defaultPickerValue = valueUnwrapped; 
     }, 0); 
    } 
} 

用法：

<input id="end" name="end" type="date" data-bind="value: end, jqmDateBox: end" data-role="datebox" /> 

由大衛

Answer 2

的結合提供了對我沒有工作。我正在使用Datebox的最新不穩定版本。

我寫此綁定，這對我在calbox模式下工作：

ko.bindingHandlers['dateboxvalue'] = { 
    'init': function(element, valueAccessor, allBindingsAccessor, viewModel) { 

    ko.utils.registerEventHandler(element, "change", function() { 
     var value = valueAccessor(); 
     value($(element).datebox('getTheDate')); 
    }); 
}, 
    'update': function (element, valueAccessor, allBindingsAccessor, context) { 

    $(element).datebox(); 
    $(element).datebox('setTheDate', ko.utils.unwrapObservable(valueAccessor())); 
    $(element).trigger('datebox', {'method':'doset'}); 
    } 
}; 

使用這樣

<label for="mode1">CalBox</label> 
<input name="mode1" id="mode1" type="text" 
     data-role="datebox" 
     data-options='{"mode":"calbox", "useNewStyle":true}' 
     data-bind="dateboxvalue: myDate"/>