Child pages
  • Rich Text Inline Edit API

Documentation for a historical release of Infusion: 1.3
Please view the Infusion Documentation site for the latest documentation.
If you're looking for Fluid Project coordination, design, communication, etc, try the Fluid Project Wiki.

Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 10 Next »

This documentation refers to the latest trunk version of the Inline Edit code.

Rich Text Inline Edit Overview

The Rich Text Inline Edit is a specific integration of the Inline Edit component that uses a rich text editor to allow users to quickly make edits to formatted text. Two versions of Rich Text Inline Edit are provided, each using a different rich text editor:

  1. FCKEditor
  2. TinyMCE


fluid.inlineEdit.FCKEditor(container, options);
fluid.inlineEdit.TinyMCE(container, options);

Return: The Dropdown Inline Edit component object.

On This Page
Still need help?

Join the fluid-talk mailing list and ask your questions there.


The Rich Text Inline Edit is a specific configuration of the Inline Edit component. It's API is fundamentally the same as the [Simple Text Inline Edit API[, but some of the options are pre-configured.


FCKEditor integration:

fluid.defaults("fluid.inlineEdit.FCKEditor", {
    selectors: {
        edit: "textarea" 
    styles: {
        invitation: null
    displayAccessor: "fluid.inlineEdit.richTextViewAccessor",
    editAccessor: "fluid.inlineEdit.FCKEditor.viewAccessor",
    lazyEditView: true,
    editModeRenderer: fluid.inlineEdit.FCKEditor.editModeRenderer

TinyMCE integration:

fluid.defaults("fluid.inlineEdit.tinyMCE", {
    useTooltip: true,
    selectors: {
        edit: "textarea" 
    styles: {
        invitation: null
    displayAccessor: "fluid.inlineEdit.richTextViewAccessor",
    editAccessor: "fluid.inlineEdit.tinyMCE.viewAccessor",
    lazyEditView: true,
    editModeRenderer: fluid.inlineEdit.tinyMCE.editModeRenderer


The Rich Text Inline Edit dependencies can be met by including the minified Fluid-all.js file in the header of the HTML file:

<script type="text/javascript" src="Fluid-all.js"></script>

Alternatively, the individual file requirements are:

<script type="text/javascript" src="jquery/jquery-1.2.6.js"></script>
<script type="text/javascript" src="jquery/jARIA.js"></script>
<script type="text/javascript" src="jquery/jquery.keyboard-a11y.js"></script>
<script type="text/javascript" src="jquery/jquery.tooltip.js"></script>
<!-- javascript files specific to the rich text editor of choice -->
<script type="text/javascript" src="fluid/Fluid.js"></script>
<script type="text/javascript" src="fluid/InlineEdit.js"></script>
<script type="text/javascript" src="fluid/InlineEditIntegrations.js"></script>
  • No labels