在 EXT JS 4 中集成 CKEditor 4

Question

提前谢谢你。我正在尝试将 CKEditor 4 与我的 extjs 4.2 项目集成。有人可以帮我整合吗？在网上搜索后，我发现了 This example，但由于 "this.editor" 未定义，所以无法正常工作。我也尝试使用 "CKEDITOR.instances[this.id]" 但仍然没有帮助。这引发了另一个错误 "Cannot read property 'setData' of undefined"。如果有人可以帮助我，那将是非常可观的。

Answer 1

新的快乐。找到解决方案。

Ext.define('Ext.ux.form.field.CKEditor', {
extend: 'Ext.form.field.TextArea',
alias: 'widget.ckeditor',

constructor: function () {
    this.callParent(arguments);
    this.addEvents("instanceReady");
    this.addEvents("blur");
},

initComponent: function () {
    this.callParent(arguments);
    this.on("afterrender", function () {
        Ext.apply(this.CKConfig, {
            height: this.getHeight(),
            width: this.getWidth()
        });

        this.editor = CKEDITOR.replace(this.inputEl.id, this.CKConfig);
        this.editor.name = this.name;

        this.editor.on("instanceReady", function () {
            this.fireEvent("instanceReady", this, this.editor );
        }, this);

        this.editor.on("blur", function (){
            this.fireEvent("blur", this, this.editor );
        }, this)

    }, this);
},

onRender: function (ct, position) {
    if (!this.el) {
        this.defaultAutoCreate = {
            tag: 'textarea',
            autocomplete: 'off'
        };
    }
    this.callParent(arguments)
},

setValue: function (value) {    
    this.callParent(arguments);
    if (this.editor) {
        this.editor.setData(value);
    }
},

getValue: function () {
    if (this.editor) {
        console.log(this.editor.getData());
        return this.editor.getData();
    } 
    else {
        return ''
    }
}

});

这将 ckeditor 与 EXT jS 集成。

在 EXT JS 4 中集成 CKEditor 4

Integrate CKEditor 4 in EXT JS 4

javascript

integration

extjs

ckeditor