Bootstrap DatePicker允许通过输入编辑

在我目前的项目中，我使用Bootstrap datepicker来允许用户选择日期。Bootstrap DatePicker允许通过输入编辑

有一个请求允许人们将日期输入到datePicker输入中，而不必手动点击小部件中的日期。

当前用户手动编辑日期字符串时，日期选择器将突出显示正确的日期，但不会更新分配给它的变量。（作为一个说明，我正在使用Knockout.js和使用可观察的存储日期）

我的想法是，这只会触发changeDate函数，但它不会。

有没有人曾试图实现这一点，并得到它的工作？

来源

2013-02-05 Thewads

我已经创建了两个单独装订处理器实现了这一点。一个将输入绑定到日期可见性，另一个绑定日期选择器。它看起来像那样。 '

' –

我正在重新编写代码，因为它是在特定架构中编写的，无法复制/粘贴。如果你想我可以提取绑定作为答案。 –

我真的认为你应该发布你的解决方案作为答案。这对社区肯定是有价值的。 –

以下是datePicker和dateValue绑定的working jsfiddle和gist，它们独立绑定到可观察对象并相应地更新它。

<div class="input-append date"> 
    <input type="text" data-bind="dateValue: date" /> 
    <span class="add-on datepicker-button" data-bind="datePicker: { date: date }"> 
     <i class="icon-calendar"></i> 
    </span> 
</div>

的绑定被写入与BindingHandlerFactory包装，
1.创建绑定的每个元素，并将其存储与所述$.data()元件上的处理程序对象。
2.调用处理程序的initialize(element, context)一次。
3.每次绑定上下文更改时调用处理程序的contextChanged(context)方法。

来源

2013-02-07 10:19:26

为什么不使用KO的不可读/写选项。

像

function yourModel(){ 
var self = this; 
self.theDateUserManuallyWillEnter = ko.computed({ 
read: function() { 
    if (self.theDateUserManuallyWillEnter != undefined) 
     return self.theDateUserManuallyWillEnter ; 
    else 
     return $('#theDateUserManuallyWillEnteredTextBox').val(); //Jquery  
           identifier of text box 
}, 
write: function (value) { 
    self.theDateUserManuallyWillEnter = value; 
}, 
owner: this 
}); 
}

来源

2013-10-24 22:37:53 Bhagirath

Bootstrap DatePicker允许通过输入编辑

回答

相关问题