close

Filter

Close X
loading table of contents...

Studio Developer Manual / Version 2010

Table Of Contents

7.4.5.7 Interacting with the CKEditor via API

Interacting with the CKEditor via API

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 config parameter 

[Bindable]
public var ckEditorValueExpression:ValueExpression;

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');

Search Results

Table Of Contents