If you want to interact with the CKEditor without writing a CKEditor plugin, you can add a standard ExtJS action
to the toolbar of the richTextPropertyField
.
To gain access to the CKEditor you have to create a baseClass
for your action
and add the following method:
[InjectFromExtParent] public function setCKEditor(editor:*):void { ... }
The injected editor
object is of type CKEDITOR.editor
(see http://docs.ckeditor.com/#!/api/CKEDITOR.editor) and can be used according to your needs.
However, there are two things to consider when writing your own custom actions:
Undo / Redo: In order to be able to undo / redo the changes your action has made, you have to send one
saveSnapshot
event before and one after making the changes, like so:editor.fire('saveSnapshot'); // perform changes ... editor.fire('saveSnapshot');
Saving Changes: In order to update the bound content with the changes your action has made, it may be necessary to send an additional
save
event. This event is recognized by the property field which will then trigger the update. The CKEditor already tracks changes and the property field will react to it, but in some cases this is not possible. You should check if the content gets checked-out when your action is performed, and if not add the following code:// perform changes ... editor.fire('save');