Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 5.3

...

Inline Edit

...

Inline Edit

Section
titleBGColor
  • Inline Edit
  • Simple Text Inline Edit

    API

  • Dropdown Inline Edit API
  • Rich Text Inline Edit API
  • Column
    width50%

    Inline Edit allows a user to do quick edits to simple text without having to switch modes or screens. All work is done on the same interface, which helps the user maintain context.

    The basic form of the Inline Edit component is the Simple Text Inline Edit. Three specific integrations are also available:

    • a Dropdown Inline Edit
    • a Rich Text Inline Edit using the FCKEditorCKEditor
    • a Rich Text Inline Edit using TinyMCE
    Column
    Panel
    borderColor#566b30
    bgColor#fff
    titleBGColor#D3E3C4
    titleOn This Page
    borderStylesolid
    Table of Contents
    minLevel2
    maxLevel5
    Panel
    borderColor#321137
    bgColor#fff
    #c1b7c3
    titleSee Also
    borderStylesolid
    Panel
    borderColor#321137
    bgColor#fff
    titleBGColor#cccccc
    titleStill need help?
    borderStylesolid

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

    Simple Text Inline Edit

    Code Block
    javascript
    javascript
    
    fluid.inlineEdit(container, options);
    
    Code Block
    javascript
    javascript
    
    fluid.inlineEdits(container, options);
    

    Creates an Inline Edit component (or multiple components) that uses a simple input field for the edit mode. See Simple Text Inline Edit API for details.

    Dropdown Inline Edit

    Code Block
    javascript
    javascript
    
    fluid.inlineEdit.dropdown(container, options);
    

    Creates an Inline Edit component that uses a dropdown selection box for the edit mode. See Dropdown Inline Edit API for details.

    Rich Text Inline Edit

    Code Block
    javascript
    javascript
    
    fluid.inlineEdit.
    FCKEditor
    CKEditor(container, options);
    
    Code Block
    javascript
    javascript
    
    fluid.inlineEdit.tinyMCE(container, options);
    

    Creates an Inline Edit component that uses a rich text editor for the edit mode. See Rich Text Inline Edit API for details.

    Column
    Panel
    borderColor#321137
    bgColor#fff
    titleBGColor#aab597
    borderStylesolid
    titleStatus

    Dropdown is in Sneak Peek status
    Rich Text is in Sneak Peek status
    Simple Text is in Production status

    Panel
    borderColor#566b30
    bgColor#fff
    titleBGColor#D3E3C4
    borderStylesolid
    titleOn This Page
    Table of Contents
    maxLevel5
    minLevel2
    Panel
    borderColor#321137
    bgColor#fff
    titleBGColor#c1b7c3
    borderStylesolid
    titleSee Also
    Panel
    borderColor#321137
    bgColor#fff
    titleBGColor#cccccc
    borderStylesolid
    titleStill need help?

    Join the infusion-users mailing list and ask your questions there.

    ...

    Anchor
    events
    events

    Supported Events

    The Inline Edit component fires the following events (for more information about events in the Fluid Framework, see Events for Component Users):

    Include Page
    Inline Edit Events
    Inline Edit Events
    Include Page
    Inline Edit Functions
    Inline Edit Functions
    Include Page
    Inline Edit Configuration Options
    Inline Edit Configuration Options
    nopaneltrue

    ...

    Dependencies

    The Inline Edit dependencies can be met by including the minified InfusionAll.js file in the header of the HTML file:

    Code Block
    html
    html
    
    <script type="text/javascript" src="InfusionAll.js"></script>
    

    Alternatively, the individual file requirements are:

    Include Page
    Inline Edit Dependencies
    Inline Edit Dependencies
    nopaneltrue