Functions & Events

Functions
+ It can be accessed from "core.functions" or object returned after editor creation.

Events
+ It can be accessed from object returned after editor creation.
+ It can be redefined by receiving event object as parameter.
+ It is not called in exceptional cases and is called after the default event function has finished.

functions

setToolbarButtons(buttonList)

Reset the buttons on the toolbar. (Editor is not reloaded)
You cannot set a new plugin for the button.
Name Type Description
buttonList Array Button list

setOptions(options)

Add or reset option property. (Editor is reloaded)
Name Type Description
options Object Options

setDefaultStyle(style)

Set "options.defaultStyle" style.
Define the style of the edit area.
It can also be defined with the "setOptions" method, but the "setDefaultStyle" method does not render the editor again.
Name Type Description
style String Style string

noticeOpen(message)

Open a notice area.
Name Type Description
message String Notice message

noticeClose()

Close a notice area.

save()

Copying the contents of the editor to the original textarea

getContext() → {Object}

Gets the suneditor's context object. Contains settings, plugins, and cached element objects.

getContents(onlyContents) → {String}

Gets the contents of the suneditor
Parameters:
Name Type Description
onlyContents Boolean Return only the contents of the body without headers when the "fullPage" option is true

getText() → {String}

Gets only the text of the suneditor contents

getCharCount(charCounterType) → {Number}

Get the editor's number of characters or binary data size.
You can use the "charCounterType" option format.
Parameters:
Name Type Description
charCounterType String|null charCounterType options - charCounterType ('char', 'byte', 'byte-html') or null
If argument is no value, the currently set "charCounterType" option is used.

getImagesInfo() → {Array}

Gets uploaded images informations
[{
index: data index
name: file name
size: file size
select: select function
delete: delete function
element: target element
src: src attribute of tag
}]

getFilesInfo(pluginName) → {Array}

Gets uploaded files(plugin using fileManager) information list.
image: [img], video: [video, iframe], audio: [audio]
When the argument value is 'image', it is the same function as "getImagesInfo". [{
index: data index
name: file name
size: file size
select: select function
delete: delete function
element: target element
src: src attribute of tag
}]
Parameters:
Name Type Description
pluginName String Plugin name (image, video, audio)

insertImage(files)

Upload images using image plugin
Parameters:
Name Type Description
files FileList FileList

insertHTML(html, notCleaningData, checkCharCount, rangeSelection)

Inserts an HTML element or HTML string or plain string at the current cursor position
Parameters:
Name Type Description
html Element|String HTML Element or HTML string or plain string
notCleaningData Boolean If true, inserts the HTML string without refining it with core.cleanHTML.
checkCharCount Boolean If true, if "options.maxCharCount" is exceeded when "element" is added, null is returned without addition.
rangeSelection Boolean If true, range select the inserted node.

setContents(contents)

Change the contents of the suneditor
Parameters:
Name Type Description
contents String Contents to Input

appendContents(contents)

Add contents to the suneditor
Parameters:
Name Type Description
contents String Contents to Input

readOnly(value)

Switch to or off "ReadOnly" mode.
Parameters:
Name Type Description
value Boolean "readOnly" boolean value.

disable()

Disable the suneditor

enable()

Enable the suneditor

show()

Show the suneditor

hide()

Hide the suneditor

destroy()

Destroy the suneditor

{toolbar}

An object with toolbar-related methods
Properties:
Name Type Description
disable() Function Disable the toolbar
enable() Function Enable the toolbar
show() Function Show the toolbar
hide() Function Hide the toolbar

events

It can be redefined by receiving event object as parameter.
It is not called in exceptional cases and is called after the default event function has finished.

onload(core, reload)

Scroll event
Name Type Description
core Object Core Object
reload Boolean When reloaded with the "setOptions" method, the value of the this argument is true.

onScroll(event, core)

Scroll event
Name Type Description
event Object Event Object
core Object Core Object

onMouseDown(event, core)

Mouse down event
Name Type Description
event Object Event Object
core Object Core Object

onClick(event, core)

Click event
Name Type Description
event Object Event Object
core Object Core Object

onInput(event, core)

Wysiwyg editor area Input event
Name Type Description
event Object Event Object
core Object Core Object

onKeyDown(event, core)

KeyDown event
Name Type Description
event Object Event Object
core Object Core Object

onKeyUp(event, core)

KeyUp event
Name Type Description
event Object Event Object
core Object Core Object

onDrop(event, cleanData, maxCharCount, core)

Drop event
Name Type Description
event Object Event Object
cleanData String HTML string modified for editor format
maxCharCount Boolean maxCharCount option (true if max character is exceeded)
core Object Core Object

onChange(contents, core)

When the contents change
Name Type Description
contents String HTML string
core Object Core Object

onFocus(event, core)

Focus event
Name Type Description
event Object Event Object
core Object Core Object

onBlur(event, core, contents)

Focus event
Name Type Description
event Object Event Object
core Object Core Object
contents String Current contents

onPaste(event, cleanData, maxCharCount, core)

Paste event.
Called before the editor's default event action.
If it returns false, it stops without executing the rest of the action.
Name Type Description
event Object Event Object
cleanData String HTML string modified for editor format
maxCharCount Boolean maxCharCount option (true if max character is exceeded)
core Object Core Object

onCopy(event, clipboardData, core)

Copy event.
Called before the editor's default event action.
If it returns false, it stops without executing the rest of the action.
Name Type Description
event Object Event Object
clipboardData Object event.clipboardData
core Object Core Object

onCut(event, clipboardData, core)

Cut event.
Called before the editor's default event action.
If it returns false, it stops without executing the rest of the action.
Name Type Description
event Object Event Object
clipboardData Object event.clipboardData
core Object Core Object

onImageUploadBefore(files, info, core, uploadHandler) → {Boolean|Array|undefined}

Called before the image is uploaded.
If true is returned, the internal upload process runs normally.
If false is returned, no image upload is performed.
If new fileList are returned, replaced the previous fileList.
If undefined is returned, it waits until "uploadHandler" is executed.
Name Type Description
files FileList Files array
info Object linkValue: Link url value
linkNewWindow: Open in new window Check Value
inputWidth: Value of width input
inputHeight: Value of height input
align: Align Check Value
isUpdate: Update image if true, create image if false
element: If isUpdate is true, the currently selected image
core Object Core Object
uploadHandler Function If undefined is returned, it waits until "uploadHandler" is executed.
"uploadHandler" is an upload function with "core" and "info" bound.
[upload files] : uploadHandler(files or [new File(...),])
[error]             : uploadHandler("Error message")
[Just finish]    : uploadHandler()
[directly register] : uploadHandler(response) // Same format as "imageUploadUrl" response
                               ex) {
                                   // "errorMessage": "insert error message",
                                   "result": [ { "url": "...", "name": "...", "size": "999" }, ]
                                }

onImageUpload(targetElement, index, state, info, remainingFilesCount, core)

Called when the image is uploaded, updated, deleted
Name Type Description
targetElement Element Target element
index Number Uploaded index (key value)
state String Upload status ('create', 'update', 'delete')
info Object index: data index
name: file name
size: file size
select: select function
delete: delete function
element: target element
src: src attribute of tag
remainingFilesCount Number Count of remaining files to upload (0 when added as a url)
core Object Core Object

onImageUploadError(errorMessage, result, core) → {Boolean}

Called when the image is uploaded or the uploaded image is deleted
Name Type Description
errorMessage String Error message to show
result Object Response object
core Object Core Object

imageUploadHandler(xmlHttp, info, core)

It replaces the default callback function of the image upload.
Name Type Description
xmlHttp XMLHttpRequest xmlHttpRequest object
info Object -- Input information --
linkValue: Link url value
linkNewWindow: Open in new window Check Value
inputWidth: Value of width input
inputHeight: Value of height input
align: Align Check Value
isUpdate: Update image if true, create image if false
element: If isUpdate is true, the currently selected image.
core Object Core Object

onVideoUploadBefore(files, info, core, uploadHandler) → {Boolean|Array|undefined}

Called before the video is uploaded.
If true is returned, the internal upload process runs normally.
If false is returned, no video(iframe, video) upload is performed.
If new fileList are returned, replaced the previous fileList.
If undefined is returned, it waits until "uploadHandler" is executed.
Name Type Description
files FileList Files array
info Object inputWidth: Value of width input
inputHeight: Value of height input
align: Align Check Value
isUpdate: Update video if true, create video if false
element: If isUpdate is true, the currently selected video
core Object Core Object
uploadHandler Function If undefined is returned, it waits until "uploadHandler" is executed.
"uploadHandler" is an upload function with "core" and "info" bound.
[upload files] : uploadHandler(files or [new File(...),])
[error]             : uploadHandler("Error message")
[Just finish]    : uploadHandler()
[directly register] : uploadHandler(response) // Same format as "videoUploadUrl" response
                               ex) {
                                   // "errorMessage": "insert error message",
                                   "result": [ { "url": "...", "name": "...", "size": "999" }, ]
                                }

onVideoUpload(targetElement, index, state, info, remainingFilesCount, core)

Called when the video(iframe, video) is uploaded, updated, deleted
Name Type Description
targetElement Element Target element
index Number Uploaded index (key value)
state String Upload status ('create', 'update', 'delete')
info Object index: data index
name: file name
size: file size
select: select function
delete: delete function
element: target element
src: src attribute of tag
remainingFilesCount Number Count of remaining files to upload (0 when added as a url)
core Object Core Object

onVideoUploadError(errorMessage, result, core) → {Boolean}

Called when the video(iframe, video) upload failed
Name Type Description
errorMessage String Error message to show
result Object Response object
core Object Core Object

videoUploadHandler(xmlHttp, info, core)

It replaces the default callback function of the video upload.
Name Type Description
xmlHttp XMLHttpRequest xmlHttpRequest object
info Object -- Input information --
inputWidth: Value of width input
inputHeight: Value of height input
align: Align Check Value
isUpdate: Update video if true, create video if false
element: If isUpdate is true, the currently selected video.
core Object Core Object

onAudioUploadBefore(files, info, core, uploadHandler) → {Boolean|Array|undefined}

Called before the audio is uploaded.
If true is returned, the internal upload process runs normally.
If false is returned, no audio upload is performed.
If new fileList are returned, replaced the previous fileList.
If undefined is returned, it waits until "uploadHandler" is executed.
Name Type Description
files FileList Files array
info Object isUpdate: Update audio if true, create audio if false
element: If isUpdate is true, the currently selected audio
core Object Core Object
uploadHandler Function If undefined is returned, it waits until "uploadHandler" is executed.
"uploadHandler" is an upload function with "core" and "info" bound.
[upload files] : uploadHandler(files or [new File(...),])
[error]             : uploadHandler("Error message")
[Just finish]    : uploadHandler()
[directly register] : uploadHandler(response) // Same format as "audioUploadUrl" response
                               ex) {
                                   // "errorMessage": "insert error message",
                                   "result": [ { "url": "...", "name": "...", "size": "999" }, ]
                                }

onAudioUpload(targetElement, index, state, info, remainingFilesCount, core)

Called when the audio is uploaded, updated, deleted
Name Type Description
targetElement Element Target element
index Number Uploaded index (key value)
state String Upload status ('create', 'update', 'delete')
info Object index: data index
name: file name
size: file size
select: select function
delete: delete function
element: target element
src: src attribute of tag
remainingFilesCount Number Count of remaining files to upload (0 when added as a url)
core Object Core Object

onAudioUploadError(errorMessage, result, core) → {Boolean}

Called when the audio upload failed
Name Type Description
errorMessage String Error message to show
result Object Response object
core Object Core Object

onResizeEditor(errorMessage, result, core, resizeObserverEntry) → {Boolean}

Called when the audio upload failed
Name Type Description
height Number Height after resized (px)
prevHeight Number Prev height before resized (px)
core Object Core Object
resizeObserverEntry Object | null ResizeObserverEntry Object
"resizeObserverEntry" is not provided in IE Browser.

onSetToolbarButtons(buttonList, core)

Called after the "setToolbarButtons" invocation.
Can be used to tweak buttons properties (useful for custom buttons)
Name Type Description
buttonList Array Button list
core Object Core Object

audioUploadHandler(xmlHttp, info, core)

It replaces the default callback function of the audio upload
Name Type Description
xmlHttp XMLHttpRequest xmlHttpRequest object
info Object -- Input information --
isUpdate: Update audio if true, create audio if false
element: If isUpdate is true, the currently selected audio
core Object Core Object

showInline(toolbar, context, core)

Called just before the inline toolbar is positioned and displayed on the screen.
Name Type Description
toolbar Element Toolbar Element
context Object The editor's context object (editor.getContext()|core.context)
core Object Core Object

toggleCodeView(isCodeView, core)

An event when toggling between code view and wysiwyg view.
Name Type Description
isCodeView Boolean Whether the current code view mode
core Object Core Object

toggleFullScreen(isFullScreen, core)

An event when toggling full screen.
Name Type Description
isFullScreen Boolean Whether the current full screen mode
core Object Core Object

showController(name, controllers, core)

Called just after the controller is positioned and displayed on the screen.
controller - editing elements displayed on the screen [image resizing, table editor, link editor..]]
Name Type Description
name String The name of the plugin that called the controller
controllers Array Array of Controller elements
core Object Core Object