CKEDITOR with EXTJS 4

[JesusM]

Hello

I´m trying to adapt CKEDITOR in EXTJS 4 but I have the next error CKEDITOR.instances[this.id] is undefined in the line:

CKEDITOR.instances[this.id].setData(value);

In EXTJS 3 it works perfectly!

This is the code:

editorCK = Ext.create('widget.ckeditor',{
id:'editorCK',
CKConfig: {
customConfig : 'ckeditor/config.js',
toolbar: 'Basic',
height : 200,
width: 500
}

});






Ext.define('Ext.ux.CKeditor',{
extend: 'Ext.form.field.TextArea',
alias: 'widget.ckeditor',
initComponent: function(){
this.callParent(arguments);//Ext.ux.CKeditor.superclass.initComponent.apply(this, arguments);
},
onRender : function(ct, position){
if(!this.el){
this.defaultAutoCreate = {
tag: 'textarea',
autocomplete: 'off'
};
}
Ext.form.field.TextArea.superclass.onRender.call(this, ct, position);
CKEDITOR.replace(this.id, this.CKConfig);
},
setValue : function(value){
Ext.form.field.TextArea.superclass.setValue.apply(this,[value]);
CKEDITOR.instances[this.id].setData(value);
CKEDITOR.instances[this.id] is undefined

},
getValue : function(){
CKEDITOR.instances[this.id].updateElement();
var value=CKEDITOR.instances[this.id].getData();
Ext.form.field.TextArea.superclass.setValue.apply(this,[value]);
return Ext.form.field.TextArea.superclass.getValue.apply(this);
},
getRawValue : function(){
CKEDITOR.instances[this.id].updateElement();
return Ext.form.field.TextArea.superclass.getRawValue(this);
}
});

Can anyone help me, please?

Thanks!

[silcreval]

It doesnt look like you've instantiated CKEDITOR anywhere. Shouldnt you be
creating CKEDITOR in the initComponent method, ie

this.CKEDITOR = new .....

and then referring to it in the methods as

this.CKEDITOR

also you probably want to be using callParent(arguments) rather than superclass
in the method overrides.

Ian.

[codeart.ch]

I think this code

CKEDITOR.replace(this.id, this.CKConfig);

makes a instance of ckeditor.

[Dmoney]

Did you get this working? I need to explore alternatives to the htmlEditor.

[dorgan]

Why explore alternatives?? Why not extend it you can add buttons and custom functionality.

[Dmoney]

I looked into extending the htmlEditor but I couldn't make sense of it. Specifically I wanted to be able to select h1, h2, h3 tags. As I want to enable text editing but still maintain control over the style.

the other problem I have is pasting. I want to be able to paste as plain text. not only can I not paste as plain text in the htmlEditor if the text is plain text to begin with it's automatically wrapped in font and style tags.