【问题标题】:Bootstrap datepicker multiple formatsBootstrap datepicker 多种格式
【发布时间】:2014-08-22 15:09:49
【问题描述】:

我在表单中使用带有 Bootstrap Datepicker 的 Backbone.js。

简述是允许客户端使用“dd.mm.yyyy”格式,所以我在日期选择器上设置了选项。

self.$el.find('[data-role="invoicedate"]').datepicker({
    format: "dd.mm.yyyy",
    todayBtn: "linked",
    todayHighlight: true,
    language: Application_language
});

然后客户也想允许'dd.mm.yy',并让它自动翻译,所以我做了以下:

invoicedateToModel: function() {
    var invoicedate = this.$el.find('[data-role="invoicedate"]').val();
    var re2 = /^(\d{2})\.(\d{2})\.(\d{2})$/;
    if (re2.test(invoicedate)) {
        invoicedate = invoicedate.replace(re2,"$1.$2.20$3");
    }
    var re4 = /^(\d{2})\.(\d{2})\.(\d{4})$/;
    if (re4.test(invoicedate)) {
        this.saveInvoiceDate(invoicedate);
        this.displayInvoiceDate();
        this.$el.find('[data-role="invoicedate"]').parent().toggleClass('has-error', false);
    } else {
        this.$el.find('[data-role="invoicedate"]').parent().toggleClass('has-error', true);
    }
},

并将其绑定到输入的更改事件。这很好用,我现在意识到,因为 dd.mm.yy 符合 dd.mm.yyyy 格式,即它并不矛盾。

现在客户还希望能够添加 ddmmyyyy 作为输入选项,但日期选择器通过将新输入的日期替换为最后一个已知的正确日期或今天的日期来自动更正表单,因为 ddmmyyyy 与 dd 不匹配。 mm.yyyy,在上面的回调被调用之前。

有没有办法告诉 bootstrap-datepicker 多种允许的格式?

【问题讨论】:

    标签: javascript backbone.js datepicker bootstrap-datepicker


    【解决方案1】:

    您可以将函数传递给 datepicker 的格式选项。对于真正灵活的解析,我使用了moment.js

    $(".datepicker").datepicker({
      format: {
        toDisplay: function(date, format, language) {
          return moment(date).format("MM/DD/YYYY");
        },
        toValue: function(date, format, language) {
          return moment(date, ["DD.MM.YYYY", "DDMMYYYY"]).toDate();
        }
      }
    });
    

    来自引导日期选择器docs

    toDisplay:将日期对象转换为字符串的函数(日期、格式、语言),将存储在输入字段中

    toValue:将字符串对象转换为日期的函数(日期、格式、语言),用于日期选择

    您可能不得不尝试使用moment() 选项,但您应该能够将它放到您想要的位置。也请查看 momentjs 的 docs

    【讨论】:

      猜你喜欢
      • 2014-09-12
      • 1970-01-01
      • 1970-01-01
      • 2019-10-04
      • 1970-01-01
      • 1970-01-01
      • 2012-11-24
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多