Sencha Touch - 如何防止日期选择器隐藏?

时间:2012-07-31 03:03:56

标签: events sencha-touch datepicker hide

我正在使用Ext.picker.Date,我在hide事件上运行了一些检查。但是,如果满足某个条件,我想停止该过程并使日期选择器不被隐藏。

我已尝试使用beforehide事件,并在那里运行我的代码,但该事件似乎没有触发。

以下是我的datepicker的配置。如果条件为真,我怎样才能阻止选择器隐藏?

感谢您的帮助。

var datePicker = new Ext.picker.Date({
        docked: "bottom",
        listeners: {
            beforehide: function() {
                console.log("before hide");
            },
            hide: function() {
                if (1 == 1) {
                    //how do I stop the picker from hiding?
                    Ext.Msg.alert("You cannot select that date.");                        
                }

            }
        },
        slotOrder: ["day", "month", "year"],
        useTitles: false
    });
    this.add(datePicker);

1 个答案:

答案 0 :(得分:0)

您使用的是Sencha Touch 2吗?因为你正在使用Ext.picker.Date,所以我会假设这样。

根据文档,日期选择器不会触发隐藏事件: Sencha Docs

你真正想要做的是在“完成”之后插入一些逻辑。在捡拾器隐藏之前被轻拍。选择器在内部调用onDoneButtonTap;你可以像这样注入你自己的逻辑:

Ext.define('MyApp.widget.DatePicker', {
    extend: 'Ext.picker.Date',
    xtype: 'mypicker',

    onDoneButtonTap: function() {
        if (1 == 1) {
            Ext.Msg.alert("You cannot select that date.");
        } else {
            Ext.picker.Date.prototype.onDoneButtonTap.call(this);
        }
    }
});

this.add({
    xtype     : 'mypicker',
    docked    : "bottom",
    slotOrder : ["day", "month", "year"],
    useTitles : false
});

这假设您的逻辑将能够在日期选择器的范围内访问它所需的内容。如果不是这种情况,您可以在创建日期选择器时将其他配置传递给日期选择器...也许类似于acceptedDateRange {...}

最简单的方法可能是:

var datePicker = new Ext.picker.Date({
    docked: "bottom",
    slotOrder: ["day", "month", "year"],
    useTitles: false,
    onDoneButtonTap: function() {
        if (1 == 1) {
            Ext.Msg.alert("You cannot select that date.");
        } else {
            Ext.picker.Date.prototype.onDoneButtonTap.call(this);
        }
    }
});

this.add(datePicker);

我认为在第一个示例中定义自己的类是要走的路,特别是在将逻辑注入现有框架代码以及在多个位置使用组件的情况下。但第二个例子也可以。