如何将 JQuery Datepicker 与 Backbone-Forms 一起使用？答案

【问题标题】：How do I use JQuery Datepicker with Backbone-Forms?如何将 JQuery Datepicker 与 Backbone-Forms 一起使用？
【发布时间】：2013-01-13 14:22:12
【问题描述】：

var User = Backbone.Model.extend({
    schema: {
        date: {type: 'Date'}
    }
});

var user = new User();

var form = new Backbone.Form({
    model: user
}).render();

$('.bootstrap').append(form.el);

我输入什么类型来使用包含的 JQuery-UI 日期选择器？除了：

旧的 jQuery 编辑器仍包含在内，但可能会移至另一个存储库：

jqueryui.List
jqueryui.Date（使用 jQuery UI 弹出日期选择器）
jqueryui.DateTime

架构类型是用引号声明的，我不知道 jqueryui.Date 的字符串是什么 - 这肯定行不通。

【问题讨论】：

标签： backbone.js backbone-forms

【解决方案1】：

您想要创建一个您将命名的自定义编辑器，例如：“DatePicker”。

所有编辑器都附加到 Backbone.Form.editors。因为 DatePicker 的呈现方式与文本字段完全一样，所以我们可以使用文本字段作为基础，并且只覆盖特定于 datepicker 的行为。

我经常将 moment.js 用于一些与日期相关的工作，所以这个例子也包括了这个。此外，它基于 Bootstrap DatePicker 而不是 jQuery，但这几乎 100% 相同。

Backbone.Form.editors.DatePicker = Backbone.Form.editors.Text.extend({
    render: function() {
        // Call the parent's render method
        Backbone.Form.editors.Text.prototype.render.call(this);
        // Then make the editor's element a datepicker.
        this.$el.datepicker({
            format: 'yyyy-mm-dd',
            autoclose: true,
            weekStart: 1
        });

        return this;
    },

    // The set value must correctl
    setValue: function(value) {
        this.$el.val(moment(value).format('YYYY-MM-DD'));
    }
});

就是这样，您现在可以像这样使用日期选择器了：

schema: {
    birthday: { title: 'When were you born', type: 'DatePicker'}
}

【讨论】：

感谢您的回答 +1。

【解决方案2】：

不确定您的问题是否正确但我认为您可以在视图的初始化方法中附加 Jquery 日期选择器

【讨论】：