A license key. You are required to purchase one here.

Text displayed within the editor when its value is empty. This property can only be set from within the constructor or an "OnLoad" event.

It’s possible to load an external CSS file when the editor is in an iFrame mode. This property can only be set from within the constructor or an "OnLoad" event.

Editor's height in pixels. If you want the editor to take all the available height, use "pbFillHeight".

By default editor's "psValue" can be set or retrieved using WebSet/WebGet commands. This is useful when you work with rather small content. It does however have one drawback. The "psValue" property is a web property which means the editor content will travel back and forth between the server and a client with each call. The content is also limited to the WebApp Argument_Size (by default: 64KB).

When we work with a larger content however, it's performance wise better to set "pbSyncEditorValue" property to False, which causes "psValue" to no longer get synchronised and therefore not to be sent back and forth with each call. This also means that the "psValue" property will no longer be accessible using WebGet/WebSet commands. Instead, use set/insert/append functions.

Setting a value when "pbSyncEditorValue" is True:

Retrieving a value:

Setting a value when "pbSyncEditorValue" is False:

Retrieving a value:

Turns true when content changes after it has initially been set.

Note: If you are using an "OnChange" event to store changes made by the user, you are required to WebSet the indicator back to false after each occurrence.

Displays number of characters, both allowed and used. This property can only be set from within the constructor or an "OnLoad" event.

Automatically clears an editor's value when it's no longer visible. For example when a view containing the editor gets closed.

Sets the editor in a read-only mode.

When True, this property causes all the active CSS styles to be converted to their inline equivalents when requesting the editor's value. For example, let's assume we have a CSS class like this:

This would cause the following text within the editor to be orange: This is a test. But if we would request the value we would get this: "<p>This is a test</p>". If we would set "pbConvertCSSToInline" to True, the output would be: "<p style='color: rgb(255, 204, 51);'>This is a test</p>".

Please note that this feature doesn't seem to work when the CSS classes are loaded from within an external file ("psIframeCSSfile").

Causes toolbar to pop after an editable area is clicked, instead of being fixed at the control's top.

Displays the Fullscreen button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Bold button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Italic button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Underline button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Strikethrough button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Font family button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Font family button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Color button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Paragraph style button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Paragraph format button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Align button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Ordered list button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Unordered list button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Outdent button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Indent button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Quote button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Horizontal line button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Insert link button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Insert image button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Insert video button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Insert table button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Undo table button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Redo table button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Clear formatting button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Displays the Code view button on the toolbar. This property can only be set from within the constructor or an "OnLoad" event.

Puts the editor into an iFrame mode. This property can only be set from within the constructor or an "OnLoad" event.

When an editor is put in an iFrame mode ("pbIframe"), there are still tags that are being left out, like DOCTYPE, HEAD, STYLE, BODY etc. Setting "pbFullHtmlIframe" to True allows for usage of all HTML tags.

When True, the toolbar will always stick at the top of the control.

Sets the toolbar language. The following languages are available: Arabic, Bosnian, Czech, Danish, German, English (Canada/United Kingdom), English (United States), Estonian, Spanish, Persian, Finnish, French, Hebrew, Croatian, Hungarian, Indonesian, Italian, Japanese, Korean, Montenegrin, Norwegian, Dutch, Polish, Portuguese_Brazil, Portuguese_Portugal, Romanian, Russian, Serbian, Swedish, Thai, Turkish, Ukrainian, Chinese (China/Taiwan).

Characters limit. By default 0 (no limit).

This event is used for defining custom toolbar buttons. Use procedure DefineCustomButton to define a button.

Used for defining a custom toolbar button.

There is a pre-defined set of icons ("Froala_ToolbarIcon_*") which you can use, but you are free to use whatever you like. If you want to use a custom CSS class for your button, you're required to pass its name and define a CSS class with a "pa-" prefix, like so:

CSS:

DataFlex:

Used for requesting data from the editor. When calling "ProcessData", we can pass two optional references: an action ID and a parameter. These two will be send to "OnProcessData_*" procedure along with the editor data. Depending on the chosen data type ("Froala_DataType_*" parameter), one of the following events will fire within the editor object: OnProcessData_String, OnProcessData_StringArray or OnProcessData_UCharArray.

Also, see pbSyncEditorValue.

After calling this procedure, the following will be called:

This event will fire after editor data has been requested (using ProcessData procedure).

This event will fire after editor data has been requested (using ProcessData procedure).

This event will fire after editor data has been requested (using ProcessData procedure).

Called when image manager is opened. It's purpose is to provide a collection of images used to seed the selection list. The source of images can be both local and external.

For the event to work control requires an external file which will provide the required list. We supplied such a file, it's called "FroalaImageManager.asp" and it should be placed in AppHtml folder of your application. Next we need to instruct the editor to use that list, we do that by setting property "psImageManager" to the correct filename (in our case "FroalaImageManager.asp"). The file will call function "FroalaLoadImages" which we will be placing in an existing oWebResourceManager object ("WebResourceManager.wo").

This procedure is used for setting an editor value. To retrieve it, use ProcessData.

This procedure is used for setting an editor value. To retrieve it, use ProcessData.

This procedure is used for setting an editor value. Note that there are three different procedures to be used when setting editor data: SetData_String, SetData_StringArray and SetData_UCharArray. All three do the same, the only difference is with the data type passed. Also, note that first two are still limited to the WebApp Argument_Size, whereas UChar one is not. To retrieve a value from the editor, use ProcessData.

This procedure is used for appending an editor value. To retrieve it, use ProcessData.

This procedure is used for setting an editor value. To retrieve it, use ProcessData.

This procedure is used for appending an editor value. Note that there are three different procedures to be used when setting editor data: AppendData_String, AppendData_StringArray and AppendData_UCharArray. All three do the same, the only difference is with the data type passed. Also, note that first two are still limited to the WebApp Argument_Size, whereas UChar one is not. To retrieve a value from the editor, use ProcessData.

This procedure is used for inserting an editor value at the current cursor position. If a current selection exists, it will be overwritten by the value passed.

This procedure is used for inserting an editor value at the current cursor position. If a current selection exists, it will be overwritten by the value passed.

This procedure is used for inserting an editor value at the current cursor position. If a current selection exists, it will be overwritten by the value passed. Note that there are three different procedures to be used when setting editor data: InsertData_String, InsertData_StringArray and InsertData_UCharArray. All three do the same, the only difference is with the data type passed. Also, note that first two are still limited to the WebApp Argument_Size, whereas UChar one is not. To retrieve a value from the editor, use ProcessData".

This function is used for returning the right url for the display of the image in the editor.