Class CKEDITOR.editor

Extends CKEDITOR.event.

Defined in: core/editor_basic.js.

Class Summary
Constructor Attributes	Constructor Name and Description
	CKEDITOR.editor(instanceConfig, element, mode) Represents an editor instance.

Field Summary
Field Attributes	Field Name and Description
	config The configurations for this editor instance.
	element The DOM element that has been replaced by this editor instance.
	elementMode The mode in which the #element is linked to this editor instance.
	focusManager Controls the focus state of this editor instance.
	keystrokeHandler Controls keystrokes typing in this editor instance.
	mode The current editing mode.
	name The editor instance name.
	ui Namespace containing UI features related to this editor instance.

Method Summary
Method Attributes	Method Name and Description
<static>	CKEDITOR.editor.appendTo(elementOrId, config) Creates a new editor instance inside a specific DOM element.
<static>	CKEDITOR.editor.replace(elementOrIdOrName, config) Replaces a <textarea> or a DOM element (DIV) with a CKEditor instance.
	addCommand(commandName, commandDefinition) Adds a command definition to the editor instance.
	addMode(mode, modeEditor) Registers an editing mode.
	attachStyleStateChange(The, The) Registers a function to be called whenever a style changes its state in the editing area.
	checkDirty()
	destroy(noUpdate) Destroys the editor instance, releasing all resources used by it.
	execCommand(commandName, data) Executes a command.
	focus() Moves the selection focus to the editing are space in the editor.
	getCommand(commandName) Gets one of the registered commands.
	getData() Gets the editor data.
	getSelection() Gets the current selection from the editing area when in WYSIWYG mode.
	getSnapshot()
	insertElement(element) Inserts an element into the currently selected position in the editor.
	insertHtml(data) Inserts HTML into the currently selected position in the editor.
	openDialog(dialogName) Loads and opens a registered dialog.
	resetDirty()
	setData(data) Sets the editor data.
	setMode(mode) Sets the current editing mode in this editor instance.
	updateElement() Updates the <textarea> element that has been replaced by the editor with the current data available in the editor.

Methods borrowed from class CKEDITOR.event:: fire, fireOnce, hasListeners, implementOn, on, removeListener

Class Detail

CKEDITOR.editor(instanceConfig, element, mode)

Since: 3.0

Represents an editor instance. This constructor should be rarely used, being the CKEDITOR methods preferible.

Parameters:
{Object} instanceConfig: Configuration values for this specific instance.
{CKEDITOR.dom.element} element Optional: The element linked to this instance.
{Number} mode Optional: The mode in which the element is linked to this instance.

Field Detail

{Object} config

Since: 3.0

The configurations for this editor instance. It inherits all settings defined in (@link CKEDITOR.config}, combined with settings loaded from custom configuration files and those defined inline in the page when creating the editor.
Defined in: core/editor.js.

var editor = CKEDITOR.instances.editor1;
alert( editor.config.theme );  "default" e.g.

{CKEDITOR.dom.element} element

Since: 3.0

The DOM element that has been replaced by this editor instance. This element holds the editor data on load and post.
Defined in: core/editor.js.

var editor = CKEDITOR.instances.editor1;
alert( editor.element.getName() );  "textarea"

{Number} elementMode

Since: 3.0

The mode in which the #element is linked to this editor instance. It can be any of the following values:

CKEDITOR.ELEMENT_MODE_NONE: No element is linked to the editor instance.
CKEDITOR.ELEMENT_MODE_REPLACE: The element is to be replaced by the editor instance.
CKEDITOR.ELEMENT_MODE_APPENDTO: The editor is to be created inside the element.

var editor = CKEDITOR.replace( 'editor1' );
alert( editor.elementMode );  "1"

{CKEDITOR.focusManager} focusManager

Since: 3.0

Controls the focus state of this editor instance. This property is rarely used for normal API operations. It is mainly destinated to developer adding UI elements to the editor interface.
Defined in: core/editor.js.

{CKEDITOR.keystrokeHandler} keystrokeHandler

Since: 3.0

Controls keystrokes typing in this editor instance.
Defined in: plugins/keystrokes/plugin.js.

{String} mode

Since: 3.0

The current editing mode. An editing mode is basically a viewport for editing or content viewing. By default the possible values for this property are "wysiwyg" and "source".
Defined in: plugins/editingblock/plugin.js.

alert( CKEDITOR.instances.editor1.mode );  // "wysiwyg" (e.g.)

{String} name

Since: 3.0

The editor instance name. It hay be the replaced element id, name or a default name using a progressive counter (editor1, editor2, ...).
Defined in: core/editor.js.

var editor = CKEDITOR.instances.editor1;
alert( editor.name );  "editor1"

{CKEDITOR.ui} ui

Since: 3.0

Namespace containing UI features related to this editor instance.
Defined in: core/editor.js.

Method Detail

<static> {CKEDITOR.editor} CKEDITOR.editor.appendTo(elementOrId, config)

Since: 3.0

Creates a new editor instance inside a specific DOM element. Do not use this function directly. Use CKEDITOR.appendTo instead.

Parameters:
{Object|String} elementOrId: The DOM element or its ID.
{Object} config Optional: The specific configurations to apply to this editor instance. Configurations set here will override global CKEditor settings.

Returns:: {CKEDITOR.editor} The editor instance created.

<static> {CKEDITOR.editor} CKEDITOR.editor.replace(elementOrIdOrName, config)

Since: 3.0

Replaces a <textarea> or a DOM element (DIV) with a CKEditor instance. For textareas, the initial value in the editor will be the textarea value. For DOM elements, their innerHTML will be used instead. We recommend using TEXTAREA and DIV elements only. Do not use this function directly. Use CKEDITOR.replace instead.

Parameters:
{Object|String} elementOrIdOrName: The DOM element (textarea), its ID or name.
{Object} config Optional: The specific configurations to apply to this editor instance. Configurations set here will override global CKEditor settings.

Returns:: {CKEDITOR.editor} The editor instance created.

{Undefined} addCommand(commandName, commandDefinition)

Since: 3.0

Adds a command definition to the editor instance. Commands added with this function can be later executed with #execCommand.
Defined in: core/editor.js.

editorInstance.addCommand( 'sample',
{
    exec : function( editor )
    {
        alert( 'Executing a command for the editor name "' + editor.name + '"!' );
    }
});

Parameters:
{String} commandName: The indentifier name of the command.
{CKEDITOR.commandDefinition} commandDefinition: The command definition.

{Undefined} addMode(mode, modeEditor)

Since: 3.0

Registers an editing mode. This function is to be used mainly by plugins.
Defined in: plugins/editingblock/plugin.js.

Parameters:
{String} mode: The mode name.
{Object} modeEditor: The mode editor definition.

{Undefined} attachStyleStateChange(The, The)

Since: 3.0

Registers a function to be called whenever a style changes its state in the editing area. The current state is passed to the function. The possible states are CKEDITOR.TRISTATE_ON and CKEDITOR.TRISTATE_OFF.
Defined in: plugins/styles/plugin.js.

// Create a style object for the  element.
var style = new CKEDITOR.style( { element : 'b' } );
var editor = CKEDITOR.instances.editor1;
editor.attachStyleStateChange( style, function( state )
    {
        if ( state == CKEDITOR.TRISTATE_ON )
            alert( 'The current state for the B element is ON' );
        else
            alert( 'The current state for the B element is OFF' );
    });

Parameters:

{CKEDITOR.style} The

style to be watched.

{Function} The

function to be called when the style state changes.

{Undefined} checkDirty()

Since: 3.0

Defined in: core/editor.js.

NO EXAMPLE AVAILABLE

{Undefined} destroy(noUpdate)

Since: 3.0

Destroys the editor instance, releasing all resources used by it. If the editor replaced an element, the element will be recovered.
Defined in: core/editor.js.

alert( CKEDITOR.instances.editor1 ); e.g "object" CKEDITOR.instances.editor1.destroy(); alert( CKEDITOR.instances.editor1 ); "undefined"

Parameters:

{Boolean} noUpdate Optional

If the instance is replacing a DOM element, this parameter indicates whether or not to update the element with the instance contents.

{Boolean} execCommand(commandName, data)

Since: 3.0

Executes a command.
Defined in: core/editor.js.

editorInstance.execCommand( 'Bold' );

Parameters:

{String} commandName

The indentifier name of the command.

{Object} data Optional

Data to be passed to the command

Returns:

{Boolean} "true" if the command has been successfuly executed, otherwise "false".

{Undefined} focus()

Since: 3.0

Moves the selection focus to the editing are space in the editor.
Defined in: plugins/editingblock/plugin.js.

NO EXAMPLE AVAILABLE

{CKEDITOR.command} getCommand(commandName)

Since: 3.0

Gets one of the registered commands. Note that, after registering a command definition with addCommand, it is transformed internally into an instance of CKEDITOR.command, which will be then returned by this function.
Defined in: core/editor.js.

NO EXAMPLE AVAILABLE

Parameters:

{String} commandName

The name of the command to be returned. This is the same used to register the command with addCommand.

Returns:

{CKEDITOR.command} The command object identified by the provided name.

{String} getData()

Since: 3.0

Gets the editor data. The data will be in raw format. It is the same data that is posted by the editor.
Defined in: core/editor.js.

if ( CKEDITOR.instances.editor1.getData() == '' ) alert( 'There is no data available' );

Returns:

{Undefined} (String) The editor data.

{CKEDITOR.dom.selection} getSelection()

Since: 3.0

Gets the current selection from the editing area when in WYSIWYG mode.
Defined in: plugins/selection/plugin.js.

var selection = CKEDITOR.instances.editor1.getSelection(); alert( selection.getType() );

Returns:

{CKEDITOR.dom.selection} A selection object or null if not on WYSIWYG mode or no selection is available.

{Undefined} getSnapshot()

Since: 3.0

Defined in: core/editor.js.

NO EXAMPLE AVAILABLE

{Undefined} insertElement(element)

Since: 3.0

Inserts an element into the currently selected position in the editor.
Defined in: core/editor.js.

var element = CKEDITOR.dom.element.createFromHtml( '<img src="hello.png" border="0" title="Hello" />' ); CKEDITOR.instances.editor1.insertElement( element );

Parameters:

{CKEDITOR.dom.element} element

The element to be inserted into the editor.

{Undefined} insertHtml(data)

Since: 3.0

Inserts HTML into the currently selected position in the editor.
Defined in: core/editor.js.

CKEDITOR.instances.editor1.insertHtml( '<p>This is a new paragraph.</p>' );

Parameters:

{String} data

HTML code to be inserted into the editor.

{CKEDITOR.dialog} openDialog(dialogName)

Since: 3.0

Loads and opens a registered dialog.
Defined in: plugins/dialog/plugin.js.

CKEDITOR.instances.editor1.openDialog( 'smiley' );

Parameters:

{String} dialogName

The registered name of the dialog.

Returns:

{CKEDITOR.dialog} The dialog object corresponding to the dialog displayed. null if the dialog name is not registered.

See:

CKEDITOR.dialog.add

{Undefined} resetDirty()

Since: 3.0

Defined in: core/editor.js.

NO EXAMPLE AVAILABLE

{Undefined} setData(data)

Since: 3.0

Sets the editor data. The data must be provided in raw format.
Defined in: core/editor.js.

CKEDITOR.instances.editor1.setData( '<p>This is the editor data.</p>' );

Parameters:

{String} data

HTML code to replace the curent content in the editor.

{Undefined} setMode(mode)

Since: 3.0

Sets the current editing mode in this editor instance.
Defined in: plugins/editingblock/plugin.js.

// Switch to "source" view. CKEDITOR.instances.editor1.setMode( 'source' );

Parameters:

{String} mode

A registered mode name.

{Undefined} updateElement()

Since: 3.0

Updates the <textarea> element that has been replaced by the editor with the current data available in the editor.
Defined in: core/editor.js.

CKEDITOR.instances.editor1.updateElement(); alert( document.getElementById( 'editor1' ).value ); // The current editor data.

CKEditor 3.0 JavaScript API Documentation

Namespaces

Classes

Class CKEDITOR.editor