Page Comparison

...

Name

Description

Values

Default

selectors

Javascript object containing selectors for various fragments of the Inline Edit component.

The object can contain any subset of the following keys:
  text
  editContainer
  edit
Any values not provided will revert to the default.

Code Block

	javascript
	javascript

selectors: {
    text: ".text",
    editContainer: ".editContainer",
    edit: ".edit"
}

styles

Javascript object containing CSS style names that will be applied to the Inline Edit component.

The object can contain any subset of the following keys:
  invitation
  defaultViewText
  focus
Any values not provided will revert to the default.

Code Block

	javascript
	javascript

styles: {
    invitation: "invitation",
    defaultViewText: "invitation-text",
    focus: "focus"
}

paddings

Javascript object containing pixed values that will configure the size of the edit field.

The object can contain any subset of the following keys:
  edit
  add   minimumEdit
  minimum   minimumView
Any values not provided will revert to the default.

Code Block

	javascript
	javascript

paddings: {
    addedit: 10,
    minimumminimumEdit: 80,
    minimumView: 60
}

finishedEditing

A function that will be called each time the Inline Edit component leaves edit mode. This function can be used to communicate changes in the field to the server, or to take any other action desired by the implementor.

a function

Code Block

	javascript
	javascript

finishedEditing: function () {
}

editModeInjector

A function that creates the editable field based on the display text. This function is used if no edit container is provided in the markup.

a function

a function that creates the edit field based on the following template:

Code Block

	html
	html

<div>
  <input type='text'/>
</div>

selectOnEdit

Indicates whether or to automatically selected the editable text when the component switches into edit mode.

boolean

false

useDefaultViewText

Indicates whether or not the component should be filled in with default text when empty.

boolean

true

defaultViewText

The default text to use when filling in an empty component.

String

"Click here to edit"

...

Functions

Code Block

	javascript
	javascript

fluid.InlineEdit.edit();

...

Versions Compared

Old Version 11

New Version 12

Key

Functions