Question

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

所以任何东西都适用于我，可以是MessageBox的数字验证器，也可以是带有数字字段而不是文本字段的MessageBox。

这是我的MessageBox ...

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

对此有何想法？

更新

我设法让验证器正常工作，但我宁愿使用数字字段而不是文本字段，所以问题的第一部分仍然存在。

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

Answer 1

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

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

Messagebox的扩展应该可以工作，但是必须查看代码自MessageBox代码以来没有很多钩子的每个Ext升级。

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){} )

Answer 2

以下（黑客？）适用于我的具体情况：注意 - 由于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
});

ExtJS中的NumberField提示符

2 个答案: