ExtJS DateField 混淆格式

发布于 2025-01-07 01:18:42 字数 544 浏览 0 评论 0原文

我使用 Ext.form.DateField ，指定格式为“dmY”，如下所示：

var sellingDate = new Ext.form.DateField({
    fieldLabel : "Selling date",
    width : 180,
    name: 'sellingDate',
    format: 'd-m-Y',
    allowBlank : false
});

我希望该组件在失去焦点后以给定格式自动完成输入值。我的意思是，如果我输入文本“040212”（2012 年 2 月 4 日，在我的国家/地区，我们使用“dd-mm-YYYY”作为标准日期格式），它必须将该文本显示为“04-02” -2012'。
但是，在对 DateField 的事件“change”进行调试时，我看到解析的 Date 对象是“Mon Apr 02 2012”。我不知道如何让它按照我上面的预期工作。有没有办法从日期字段获取原始文本，而不是解析的日期对象？你能帮我解决这个问题吗？
太感谢了！

原文

I use Ext.form.DateField with specified format is 'd-m-Y', like this:

var sellingDate = new Ext.form.DateField({
    fieldLabel : "Selling date",
    width : 180,
    name: 'sellingDate',
    format: 'd-m-Y',
    allowBlank : false
});

I want this component to complete the input value automatically with given format after it lost focus. I mean if I input the text '040212' (February 4th 2012, in my country we use 'dd-mm-YYYY' as standard date format), it must display that text as '04-02-2012'.
But when debugging at event "change" of DateField, I see that the parsed Date object is "Mon Apr 02 2012". I don't know how to make it work as I expect above. Is there any way to get the raw text from date field, not a parsed Date object? Could you please help me on this?
Thank you so much!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

維他命╮ 2025-01-14 01:18:42

很简单，添加 altFormats 配置选项：

altFormats : String 多种日期格式，以“|”分隔尝试什么时候
正在解析用户输入值，但它与定义的格式不匹配

//So in your case, it should be 'dmy'
var sellingDate = new Ext.form.DateField({
    fieldLabel : "Selling date",
    width : 180,
    name: 'sellingDate',
    format: 'd-m-Y',
    altFormats: 'dmy',
    allowBlank : false
});

That's simple, add the altFormats config option:

altFormats : String Multiple date formats separated by "|" to try when
parsing a user input value and it does not match the defined format

//So in your case, it should be 'dmy'
var sellingDate = new Ext.form.DateField({
    fieldLabel : "Selling date",
    width : 180,
    name: 'sellingDate',
    format: 'd-m-Y',
    altFormats: 'dmy',
    allowBlank : false
});

回复收藏 0 原文

偏闹i 2025-01-14 01:18:42

看起来 Ext 会将任何六位数字字符串解析为 mmddyy，无论您指定的格式如何。不幸的是：-/

解析日期的逻辑发生在 Ext.form.field.Date 的 beforeBlur 方法中或 (Ext.form.DateField ExtJS 中的代码> 3).您可以“拦截”该方法并在解析日期之前对原始值执行您自己的处理：

Ext.onReady(function (){
  (function (){

    // capture the original method so we can call it later
    var originalBeforeBlur = Ext.form.field.Date.prototype.beforeBlur;

    Ext.override(Ext.form.field.Date, {
      beforeBlur: function (){
        var raw = this.getRawValue(),
            match = raw.match(/^\s*(\d{2})(\d{2})(\d{2})\s*$/);

        // rearrange the date string to match what Ext expects
        if (match){
          raw = match[2] + match[1] + match[3];
        }

        this.setRawValue(raw);
        originalBeforeBlur.call(this);
      }
    });
  })();

  var panel = new Ext.form.FormPanel({
    title: "Enter a Date",
    renderTo: Ext.getBody(),
    items: {
      xtype: "datefield",
      format: "d-m-Y"
    }
  });
});

It looks like Ext parses any six-digit string as mmddyy regardless of the format you specify. That's unfortunate :-/

The logic for parsing the date occurs in the beforeBlur method of Ext.form.field.Date or (Ext.form.DateField in ExtJS 3). You can "intercept" that method and perform your own massaging of the raw value before it parses the date:

Ext.onReady(function (){
  (function (){

    // capture the original method so we can call it later
    var originalBeforeBlur = Ext.form.field.Date.prototype.beforeBlur;

    Ext.override(Ext.form.field.Date, {
      beforeBlur: function (){
        var raw = this.getRawValue(),
            match = raw.match(/^\s*(\d{2})(\d{2})(\d{2})\s*$/);

        // rearrange the date string to match what Ext expects
        if (match){
          raw = match[2] + match[1] + match[3];
        }

        this.setRawValue(raw);
        originalBeforeBlur.call(this);
      }
    });
  })();

  var panel = new Ext.form.FormPanel({
    title: "Enter a Date",
    renderTo: Ext.getBody(),
    items: {
      xtype: "datefield",
      format: "d-m-Y"
    }
  });
});

回复收藏 0 原文

~没有更多了~