用户在Ext.form.field.HtmlEditor中键入文本时，按Ctrl + Enter [英] Catch Ctrl+Enter when user typing text in Ext.form.field.HtmlEditor

问题描述

我正在尝试在Ext.form.field.HtmlEditor(xtype:'htmleditor')中输入文本的同时按ctrl + enter发出Ajax请求，但我不知道该怎么做.
我在"htmleditor"旁边没有按钮，可以发送"htmleditor"的值，但是我想使用ctrl + enter添加该操作的键盘快捷键.
将不胜感激.

I'm trying to make ajax request when user press ctrl+enter while is entering text in Ext.form.field.HtmlEditor (xtype:'htmleditor'), but I don't know how to do it.
I'got button next to the 'htmleditor' which can send the value of the 'htmleditor' but I'd like to add keyboard shortcut for that operation with ctrl+enter.
Will appreciate some help.

它需要使用ExtJS4进行制作-我必须以某种方式将类似'keypress'的监听器添加到我的htmleditor对象中 ...
这是代码.

It need to be made with ExtJS4 - somehow I must add something like 'keypress' listener to my htmleditor object...
Here is the code..

this.htmleditor = this.addComment.add({
    region:'center',
    xtype:'htmleditor',
    margin:'0 0 0 0',
    enableSourceEdit:false,
    height:200
});

推荐答案

您不能在默认的htmleditor中监听事件.因此，您需要使用它的更新版本.

You cannot listen for events in default htmleditor. So you need use updated version of it.

此代码可以为您提供帮助(它是针对extjs 3的，因此也许您需要将其更改为4版本):

This code can help you (it is for extjs 3, so maybe you need change it for 4 version):

Cyber.ui.HtmlEditor = Ext.extend(Ext.form.HtmlEditor, {
        frame : true,
        initComponent : function() {
            Cyber.ui.HtmlEditor.superclass.initComponent.call(this);
            this.addEvents('submit');
        },
        initEditor : function() {
           Cyber.ui.HtmlEditor.superclass.initEditor.call(this);
            if (Ext.isGecko) {
                Ext.EventManager.on(this.doc, 'keypress', this.fireSubmit,
                        this);
            }
            if (Ext.isIE || Ext.isWebKit || Ext.isOpera) {
                Ext.EventManager.on(this.doc, 'keydown', this.fireSubmit,
                        this);
            }
        },
        fireSubmit : function(e) {
            if (e.ctrlKey && Ext.EventObject.ENTER == e.getKey()) {
                // Do what you need here
            }
        }
});

Ext.reg('customeditor', Cyber.ui.HtmlEditor);

并以您的形式:

this.htmleditor = this.addComment.add({
    region:'center',
    xtype:'customeditor',
    margin:'0 0 0 0',
    enableSourceEdit:false,
    height:200
});

---

我在Extjs 4上玩了很多，并找到了方法(在使用htmleditor之前，只需包含以下代码即可):

---

I played a lot with Extjs 4 and found the way (you need just include this code before you'll use htmleditor):

Ext.form.HtmlEditor.override({
    frame : true,
    initComponent: function() {
        this.callOverridden();
        this.addEvents('submit');
    },

    initEditor : function() {
        this.callOverridden();

        var me = this;
        var doc = me.getDoc();

        if (Ext.isGecko) {
            Ext.EventManager.on(doc, 'keypress', me.fireSubmit, me);
        }

        if (Ext.isIE || Ext.isWebKit || Ext.isOpera) {
            Ext.EventManager.on(doc, 'keydown', me.fireSubmit, me);
        }
    },

    fireSubmit : function(e) {
        if (e.ctrlKey && Ext.EventObject.ENTER == e.getKey()) {
            // Do what you need here
            alert('yes!');
        }
    }
});

这篇关于用户在Ext.form.field.HtmlEditor中键入文本时，按Ctrl + Enter的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！