2

我正在尝试显示带有数字字段而不是常规文本字段的 MessageBox.prompt。我无法四处创建一个新的 MessageBox，所以我决定只使用验证器，但我也遇到了一些麻烦。

所以任何东西都对我有用，要么是 MessageBox 的数字验证器，要么是带有数字字段而不是文本字段的 MessageBox。

这是我的消息框...

var msgbox = Ext.Msg.prompt('Quantity', 'Enter a number',function(btn, text){} )

对此有什么想法吗？

更新

我设法让验证器工作，但我更愿意有一个数字字段而不是一个文本字段，所以问题的第一部分仍然存在。

如何在 ExtJS 的 MessageBox.prompt 上显示数字字段而不是文本字段。

4

2 回答 2

5

看起来如果没有“黑客”，他就无法完成。Ext.Msg 是一个单例，在 initComponent 中设置了文本字段并且它是不可配置的。 http://docs.sencha.com/ext-js/4-1/source/MessageBox.html#Ext-window-MessageBox-method-initComponent

由于它是单例，因此覆盖将不起作用，也不是解决问题的好方法。

Messagebox 的扩展应该可以工作，但每次 Ext 升级时都必须查看代码，因为 MessageBox 代码没有很多钩子。

Ext.define('NumberPrompt', {
    extend: 'Ext.window.MessageBox',
    initComponent: function() {
        this.callParent();
        var index = this.promptContainer.items.indexOf(this.textField);
        this.promptContainer.remove(this.textField);
        this.textField = this._createNumberField();
        this.promptContainer.insert(index, this.textField);
    },

    _createNumberField: function() {
        //copy paste what is being done in the initComonent to create the textfield
        return new Ext.form.field.Number({
                        id: this.id + '-textfield',
                        anchor: '100%',
                        enableKeyEvents: true,
                        listeners: {
                            keydown: this.onPromptKey,
                            scope: this
                        }
        });
    }
});



var msgbox = new NumberPrompt().prompt('Quantity', 'Enter a number',function(btn, text){} )
于 2012-12-15T23:48:51.520 回答
3

以下（hack？）适用于我的具体情况：注意 - 由于 Ext.MessageBox （可能）是一个全局对象，因此必须将其重置为在需要数字过滤以外的后续上下文中使用。

var mbtext = Ext.MessageBox.textField;
mbtext.maskRe = /[0-9:]/;
mbtext.regex = /[0-9]+(:[0-9]+)?/;
Ext.MessageBox.prompt('Numeric Only', 'Enter a number: ', function(btn, text) {
  if (btn !== 'ok') return;
  if (! text) return; 
  // ... now do the work with the numeric result in text
});
于 2013-11-20T02:15:45.237 回答