View Source

h2. Overview
_Since 3.0_

{{ace:richTextEntry}} is an input component that presents to the user an advanced text editor to create and submit rich text content.

{tip}See the ICEfaces Showcase [Live Demo|] of this component, complete with source code.{tip}

h2. Getting Started

Generally, it is enough to simply bind the value of the component to a {{String}} property in a bean, and the component is ready to use.

<ace:richTextEntry value="#{richTextEntryBean.text}" />

Several options to modify the appearance of the editor are provided, and they are discussed below.

h2. Attributes
{tip:title=TagLib Documentation}This section covers attributes involved in the typical use-cases for this component. For reference, the complete taglib documentation for this component is available [here|].{tip}

The {{language}} attribute specifies the language to be used for the user interface. The default is 'en' for English.
If set to {{true}}, the {{saveOnSubmit}} attribute makes the editor save its contents to the server whenever the containing form is submitted. Otherwise, the contents will only be saved when the user clicks the save button in the user interface.
The {{skin}} attribute specifies which of the pre-defined CKEditor skins to use for the user interface. In ICEfaces 3.x, the valid values are 'v2', 'office2003', and 'kama'. In ICEfaces 4.x, the valid values are 'moono', 'moonocolor', 'moonodark', 'moonoblue', 'office2013', 'kama', and 'bootstrap' (The default is 'moono').
The {{toolbar}} attribute is used to specify one of the pre-defined toolbars to use: {{Default}} or {{Basic}}.
h2. Client Behavior Events

| save | Fired when the 'Save' button is clicked and the contents of the editor are saved (default event). |

h2. JavaScript APIs
The {{CKEDITOR}} global variable is the CKEditor's API entry point. The {{CKEDITOR.instances}} object is a map that contains references to all the rich text editor instances on the page. To access a specific editor instance, use the editor's client id as the key to fetch its main object from this map ( {{CKEDITOR.instances\['editor_client_id'\]}} ). Full API documentation can be found [here|!/api/CKEDITOR]. Look at the CKEDITOR.editor section for the API of a specific editor instance.

h2. Keyboard and ARIA Support
Full WAI-ARIA support is built-in in the CKEditor. Several keyboard shortcuts are also supported, which can be found [here|!/guide/dev_shortcuts].

The following ARIA roles are supported: application, presentation, toolbar, button, group.

h2. CSS Classes

This component doesn't use any ICEfaces-specific classes. The underlying library, CKEditor, dynamically adds a number of CSS classes; however, their purpose is more functional and structural. Changing the appearance of this component is mostly limited to using one of the supported skins. The styling and classes specified in the {{style}} and {{styleClass}} attributes are applied to the root container, respectively.

h2. Known Issues

h2. Other Notes