editor

A frame which is expected to contain an editable document. Set the value of the editortype attribute to html to create an editor document. Mozilla provides two types of editors, the HTML editor and the plaintext editor. The editor does not provide any editing user interface; you would supply that yourself. However, text editing, image resizing, and table row and cell editing capabilities are provided. If you do not set the editortype attribute on an editor, you must enable editing using the makeEditable method.

To specify the document to load in the editor use the src attribute. However, an issue is that if you specify the src attribute initially on the editor tag in the XUL file, the document does not become editable by default. To enable editing on an editor, do either of the following:

1. Set the src attribute on the editor after the outer window has loaded, for example, in the onload handler. You might also set the src attribute based on what the user selects from a file dialog. In this case, set the editortype attribute on the editor.
2. Call the makeEditable method to make the document loaded in the editor editable.
3. Enable the design mode of the document loaded in the editor.

To edit a new document, set the src attribute to about:blank.

To access most of the functionality of the editor, your application must be part of an extension or part of the chrome. XUL applications loaded via a URL from a web server will not be able to access most of the features of the editor.

See the Rich text editing and Midas pages for more information about Gecko's built-in rich text editor.

Attributes

editortype, src, type

Properties

accessibleType, commandManager, contentDocument, contentWindow, docShell, editingSession, editortype, webBrowserFind, webNavigation

Methods

getEditor, getHTMLEditor, makeEditable

Examples

This example shows how to made the editor editable by setting the designMode property of the loaded HTML document:

<script language="javascript">
function initEditor(){
  // this function is called to set up the editor
  var editor = document.getElementById("myEditor");
  editor.contentDocument.designMode = 'on';
}
</script>
<editor id="myEditor" editortype="html" src="about:blank" flex="1" type="content-primary"/>

Once editable, the document can have special formatting and other HTML pieces added to it using the document.execCommand method:

  var editor = document.getElementById("myEditor");

  // toggle bold for the current selection
  editor.contentDocument.execCommand("bold", false, null);

See the Midas overview for more command strings.

Attributes

Properties

Methods

getEditor( window )

Return type: nsIEditor

Returns the editing interface for the editor which contains numerous methods for manipulating the document. Pass the editor's contentWindow as the argument.

getHTMLEditor( window )

Return type: nsIHTMLEditor

Returns the HTML editing interface for the editor which contains methods for manipulating an HTML document. Pass the editor's contentWindow as the argument.

makeEditable( editortype, waitForLoad )

Return type: no return value

This function enables editing for an editor. Specify text or html as the editortype.

Related

Interfaces

nsIAccessibleProvider