ExtJs在ENTER按键上模拟TAB [英] ExtJs simulate TAB on ENTER keypress

问题描述

我知道这不是最聪明的想法，但我还是要做。
我们的用户想要像TAB一样使用ENTER。
所以，我想出的最好的是：

  Ext.override（Ext.form.field.Base ，{
 initComponent：function（）{
 this.callParent（arguments）; 
 
 this.on（'afterrender'，function（）{
 var me =这个; 
 this.getEl（）。on（'keypress'，function（e）{
 if（e.getKey（）== 13）{
 me.nextNode（）。focus （）; 
} 
}）; 
}）; 
} 
}）; 
  

但它仍然不能像TAB完全一样的工作。
我的意思是，它可以使用输入字段，但不是其他控件。
可能有一些低级解决方案。
任何想法？

解决方案

过去我已将监听器附加到文档中，如下所示： / p>

  Ext.getDoc（）。on（'keypress'，function（event，target）{
 
 //获取表单域组件
 var targetEl = Ext.get（target.id），
 fieldEl = targetEl.up（'[class * = x-field]'）|| {}，
 field = Ext.getCmp（fieldEl.id）; 
 
 if（
 // ENTER键被按下... 
 event.ENTER == event.getKey （）&& 
 
 //从表单字段... 
字段&& 
 
 //具有有效数据
 field.isValid（）
 
）{
 
 //获取下一个表单字段
 var next = field.next（'[isFormField]'）; 
 
 //如果存在，则重点放在下一个字段
 if（next）{
 event.stopEvent（）; 
 next.focus（）; 
}
} 
}）; 
  

I know it is not the smartest idea, but I still have to do it. Our users want to use ENTER like TAB. So, the best I came up with is this:

Ext.override(Ext.form.field.Base, {
            initComponent: function() {
                this.callParent(arguments);

                this.on('afterrender', function() {
                    var me=this;
                    this.getEl().on('keypress',function (e){
                        if(e.getKey() == 13) {
                            me.nextNode().focus();
                        }
                    });
                });
            }
        });

But it still does not work exactly the same way as TAB. I mean, it works OK with input fields, but not other controls. May be there is some low-level solution. Any ideas?

解决方案

In the past I've attached the listener to the document, something like this:

Ext.getDoc().on('keypress', function(event, target) {

    // get the form field component
    var targetEl = Ext.get(target.id),
        fieldEl = targetEl.up('[class*=x-field]') || {},
        field = Ext.getCmp(fieldEl.id);

    if (
        // the ENTER key was pressed...
        event.ENTER == event.getKey() &&

        // from a form field...
        field &&

        // which has valid data.
        field.isValid()

        ) {

        // get the next form field
        var next = field.next('[isFormField]');

        // focus the next field if it exists
        if (next) {
            event.stopEvent();
            next.focus();
        }                   
    }
});

这篇关于ExtJs在ENTER按键上模拟TAB的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！