在Ext.form.DateField中的更改事件datepicker不起作用

时间:2014-10-31 08:24:54

标签: extjs datepicker

我有像这样的

的datepicker的html范围
  <span id="spanLimitFBClaim"></span>

然后我称之为first.js

$("#spanLimitPaymentDate").datepicker("LimitPaymentDate")

datepicker来自另一个global.js

$.fn.datepicker = function (id) {
    var mydate = new Ext.form.DateField({
        xtype: 'datepicker',
        format: 'd-M-Y',
        margin: '2 0 2 0',
        renderTo: Ext.get($(this).attr("id")),
        cls: 'sa-datepicker',
        inputId: id,
        value: new Date()
    });
    $("#" + id).attr("readonly", true);
}

它是有效的。问题是。我想得到改变事件。我尝试在global.js中添加像这样的监听器

$.fn.datepicker = function (id) {
    var mydate = new Ext.form.DateField({
        xtype: 'datepicker',
        format: 'd-M-Y',
        margin: '2 0 2 0',
        renderTo: Ext.get($(this).attr("id")),
        cls: 'sa-datepicker',
        inputId: id,
        value: new Date(),
        listeners: {
            select: function () {
                console.log('Date selected: ', this.getValue());
            }
        }
    });
    $("#" + id).attr("readonly", true);
}

它有效。我看到global.js(console.log)上的值问题是如何在我的span中添加它(来自first.js)。因为我在下面的代码不起作用

$("#spanLimitPaymentDate").datepicker("LimitPaymentDate", {
    listeners: {
        select: function () {
            console.log('Date selected: ', this.getValue());
        }
    }
});

我是ext.js的新手,似乎我在使用它时输错了:(

非常感谢

1 个答案:

答案 0 :(得分:0)

在第一个版本中,您可以在函数中创建的字段的配置中设置侦听器。

在第二个版本中,将侦听器设置为所述函数的第二个参数,但该函数只接受一个参数。所以你在那里设置的配置被省略了。

如果你改变你的功能,它应该有效:

$.fn.datepicker = function (id,config) {
    var me=this;
    var mydate = new Ext.form.DateField(
        Ext.apply(config,{
            xtype: 'datepicker',
            format: 'd-M-Y',
            margin: '2 0 2 0',
            renderTo: Ext.get($(me).attr("id")),
            cls: 'sa-datepicker',
            inputId: id,
            value: new Date()
        });
    );
    $("#" + id).attr("readonly", true);
}

然后致电

$("#spanLimitPaymentDate").datepicker("LimitPaymentDate", {
    listeners: {
        select: function (picker) {
            console.log('Date selected: ', picker.getValue());
        }
    }
});