在extjs4中如何设置textfield的焦点

时间:2013-06-27 11:53:14

标签: extjs4 focus textfield

我在extjs4工作。我有激活视图表格 - enter image description here

为了输入密钥我已将项目作为 -

{
                margin:'5 5 5 5',
                xtype: 'fieldcontainer',
                fieldLabel: 'Enter key',
                layout: 'hbox',
                combineErrors: true,
                defaults: {
                    hideLabel: true
                },
                items: [{xtype: 'textfield',    fieldLabel: 'a', name: 'a', width: 80,  allowBlank:false, margins: '0 5 0 0'},
                {xtype: 'textfield',    fieldLabel: 'b', name: 'b', width: 80, allowBlank: false, margins: '0 5 0 0'},
                {xtype: 'textfield',    fieldLabel: 'c', name: 'c', width: 80, allowBlank: false, margins: '0 5 0 0'},
                {xtype: 'textfield',    fieldLabel: 'd', name: 'd', width: 80, allowBlank: false, margins: '0 5 0 0'},
                {xtype: 'textfield',    fieldLabel: 'e', name: 'e', width: 80, allowBlank: false, margins: '0 5 0 0'}]},

我想将每个块中的字符数限制为5.在第一个块中输入5个字符后,我想自动将焦点设置到下一个块。那么如何在extjs4中实现它呢

1 个答案:

答案 0 :(得分:0)

您可以添加关键侦听器。您将配置textfield这样的内容:

{
    xtype: 'textfield',
    //...other props...
    name: 'a',
    maxLength: 5,
    enableKeyEvents: true,
    enforceMaxLength: true,
    listeners: {
        keyup: function(f, e) {
            if (f.getValue().length == 5)
            {
                var nextField = f.next();
                if (nextField && Ext.isFunction(nextField.focus)) {
                    nextField.focus();
                }
            }
        }
    }
}

如果所有字段都相同,您甚至可以enableKeyEventsmaxLengthenforceMaxLengthlisteners defaults。{ / p>