By Alvin Alexander. Last updated: June 6, 2016
The following code shows how to dynamically create a Sencha ExtJS form textfield, i.e., a Ext.form.field.Text field. Maybe one of the best things about this example is that it shows how to get input focus on a textfield:
createTextField: function() { return Ext.create('Ext.form.field.Text', { fieldLabel: 'Task:', name: 'task', itemId: 'taskTextfield', autofocus: true, enableKeyEvents: true, labelAlign: 'left', labelWidth: 50, labelStyle: 'font-size: 16px;', width: 500, listeners: { // this works, putting focus in the textfield afterrender: function(field) { field.focus(false, 250); }, specialkey: function(field, event, options) { if (event.getKey() == event.ENTER) { // handle the ENTER key } } } }); }
You don’t need all of those config options, but I thought I’d leave them in there for now. See the Sencha docs for more information of what config options are available.