В extjs4 как установить фокус текстового поля

Question

Я работаю в extjs4. У меня есть активационный вид вида как-

Для ввода ключа я взял элемент как-

{ 
       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

Answer 1

Вы можете добавить слушателей ключевых слов. У вас будет настроить 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(); 
       } 
      } 
     } 
    } 
} 

Вы могли бы даже enableKeyEvents, maxLength, enforceMaxLength и listeners к вашему defaults, если они одинаковы для всех полей.