Я добавляю виртуальную клавиатуру с http://www.greywyvern.com/code/javascript/keyboard в текстовое поле формы extjs 4.2.
В основном это работает, см. здесь: http://jsfiddle.net/g5VN8/1/
1) Мой первый вопрос: действительно ли это лучший способ их подключения? Мне кажется уродливым с таймером вместо событий, чтобы поддерживать значение extjs в актуальном состоянии.
Плюс я не могу преодолеть следующие две проблемы:
2) иконка клавиатуры перенесена на новую строку. Вместо этого он должен быть в конце поля с правой стороны, как в примерах здесь: http://www.greywyvern.com/code/javascript/keyboard
3) Полевой фокус не работает. У меня это в слушателе шоу. Даже когда он завернут в window.setTimeout(), он не работает, так что это не проблема времени. Ошибка не выдается.
Вот копипаст (правила stackoverflow). Я буду держать оба места в курсе.
Ext.onReady(function() {
Ext.QuickTips.init();
var formPanel = Ext.create('Ext.form.Panel', {
renderTo: Ext.getBody(),
bodyStyle: 'padding: 5px 5px 0 5px;',
defaults: {
anchor: '100%',
},
items: [{
xtype:'textfield',
name: 'string',
fieldLabel: 'String',
maxLength:30, enforceMaxLength:true,
allowBlank: false,
listeners: {
show: function(field) {
//focus the field when the window shows
field.focus(true, 1000); //TODO: doesn't work, no error
},
afterrender:function(cmp){
cmp.inputEl.set({ //see http://jsfiddle.net/4TSDu/19/
autocomplete:'on'
});
//attach the keyboard
//because it modifies the dom directly we need to hack it to
//inform extjs (really, ext has no such listener option?)
var interval = window.setInterval(function() {
try {
var newValue = cmp.inputEl.dom.value;
var oldValue = cmp.getValue();
if (newValue != oldValue) {
//only do it then, cause it also moves the cursor
//to the end and that sucks.
cmp.setValue( newValue );
}
} catch (e) {
//form was removed
window.clearInterval(interval);
}
}, 100);
// see http://www.greywyvern.com/code/javascript/keyboard
VKI_attach(cmp.inputEl.dom);
}
}
}],
buttons: [{
text: 'Alert string',
handler: function() {
var stringField = this.up('form').getForm().findField('string');
alert(stringField.getValue());
}
}]
});
});