Content Editor component

Element

ix-content-editor

Example

// get the HTML element of the Content Editor using the provided GUID.
var contentEditor = ix.util.getHtml("<GUID>");

// set/get a "property" of the Content Editor.
contentEditor.property = "value"; // sets the property
contentEditor.property; // returns the property -> "value";

Refer to the provided examples for each property to gain a deeper understanding of utilizing the getter/setter functionality.

Hierarchy

  • UpContentEditor

Properties

placeholder: undefined | string

The placeholder attribute specifies a short hint that describes the expected value of the input field and will be displayed before the user enters a value.

Example

// sets the placeholder
contentEditor.placeholder = "Please add some content";

// returns the placeholder -> "Please add some content";
contentEditor.placeholder;
readonly: boolean

Makes the Content-Editor not mutable, meaning the user can not edit the value.

Example

// sets the readonly state
contentEditor.readonly = true;

// returns the readonly state -> true;
contentEditor.readonly;
required: boolean

Indicates that the user must specify a value for the Content-Editor before the owning form can be submitted.

Example

// sets the required state
contentEditor.required = true;

// returns the required state -> true;
contentEditor.required;
value: string

Returns/Sets the current value of the control.

Example

// sets the value
contentEditor.value = "Hello World";

// returns the value -> "Hello World";
contentEditor.value;

Methods

  • Returns the value of the field.

    Returns string

    Example

    contentEditor.getValue();
    

    Hint

    This is a convenient function for the getter of value.

  • Sets a value for the control.

    Parameters

    • value: string

      The value to set.

    Returns void

    Example

    contentEditor.setValue("Hello World");
    

    Hint

    This is a convenient function for the setter of value.

  • Switch the editor's display mode to "Markdown" or "WYSIWYG".

    WYSIWYG offers visual real-time editing similar to the final result, while Markdown uses plain text with simple formatting codes to structure content for later conversion.

    Parameters

    • editorType: "markdown" | "wysiwyg"

    Returns void

    Example

    // sets the view to markdown
    contentEditor.setView("markdown");

    // sets the view to wysiwyg
    contentEditor.setView("wysiwyg");