DocumentEditorComponent

23 Sep 202519 minutes to read

Represents react Document Editor Component

<DocumentEditorComponent></DocumentEditorComponent>

Properties

acceptTab boolean

Gets or sets a value indicating whether tab key can be accepted as input or not.

Defaults to false

autoResizeOnVisibilityChange boolean

Gets or sets a value indicating whether to start automatic resize with the specified time interval and iteration count.

• Resize action triggers automatically for the specified number of iterations, or till the parent element’s height and width is non-zero.

• If the parent element’s height and width is zero even in the last iteration, then the default height and width (200) is allocated for the Document editor.

Defaults to false

beforeXmlHttpRequestSend EmitType<XmlHttpRequestEventArgs>

Triggers before a server request is started, allows you to modify the XMLHttpRequest object (setting additional headers, if needed).

collaborativeEditingHandlerModule CollaborativeEditingHandler

Gets or sets the Collaborative editing module.

collaborativeEditingModule CollaborativeEditing

Gets or sets the Collaborative editing module.

contextMenu ContextMenu

Gets the context menu object of the document editor.

currentUser string

Gets or sets the current user.

Defaults to ’’

defaultPasteOption PasteOptions

Gets or sets the default Paste Formatting Options

Defaults to KeepSourceFormatting

documentEditorSettings DocumentEditorSettingsModel

Defines the settings for DocumentEditor customization.

Defaults to {}

documentLoadFailed EmitType<DocumentLoadFailedEventArgs>

Triggers when SFDT is failed to load in the document editor

documentName string

Gets or sets the name of the document.

Defaults to ’’

documentSettings DocumentSettingsModel

Gets the settings and properties of the document that is opened in Document editor component.

Defaults to {}

editor Editor

Gets the editor object of the document editor.

editorHistory EditorHistory

Gets the editor history object of the document editor.

enableAutoFocus boolean

Gets or sets a value indicating whether the automatic focus behavior is enabled for Document editor or not.

By default, the Document editor gets focused automatically when the page loads. If you want the Document editor not to be focused automatically, then set this property to false.

Defaults to true

enableBookmarkDialog boolean

Gets or sets a value indicating whether bookmark dialog is enabled or not.

Defaults to false

enableBordersAndShadingDialog boolean

Gets or sets a value indicating whether borders and shading dialog is enabled or not.

Defaults to false

enableCollaborativeEditing boolean

Enable collaborative editing in document editor.

Defaults to false

enableColumnsDialog boolean

Gets or sets a value indicating whether margin dialog is enabled or not.

Defaults to false

enableComment boolean

Gets or sets a value indicating whether comment is enabled or not

Defaults to false

enableContextMenu boolean

Gets or sets a value indicating whether context menu is enabled or not.

Defaults to false

enableCursorOnReadOnly boolean

Gets or sets a value indicating whether to enable cursor in document editor on read only state or not. The default value is false.

Defaults to false

enableEditor boolean

Gets or sets a value indicating whether editor needs to be enabled or not.

Defaults to false

enableEditorHistory boolean

Gets or sets a value indicating whether editor history needs to be enabled or not.

Defaults to false

enableFontDialog boolean

Gets or sets a value indicating whether font dialog is enabled or not.

Defaults to false

enableFootnoteAndEndnoteDialog boolean

Gets or sets a value indicating whether notes dialog is enabled or not.

Defaults to false

enableFormField boolean

Gets or sets a value indicating whether form fields is enabled or not.

Defaults to false

enableHyperlinkDialog boolean

Gets or sets a value indicating whether hyperlink dialog is enabled or not.

Defaults to false

enableImageResizer boolean

Gets or sets a value indicating whether image resizer is enabled or not.

Defaults to false

enableLayout boolean

Enables or disables pagination and layout rendering in the document editor.
When set to false, the editor skips layout processing such as pagination,
which can significantly improve performance during programmatic document updates.
This is useful when applying multiple changes in bulk to avoid unnecessary reflows.
Set it back to true to re-enable layout and pagination.

Defaults to true

enableListDialog boolean

Gets or sets a value indicating whether list dialog is enabled or not.

Defaults to false

enableLocalPaste boolean

Gets or sets a value indicating whether local paste needs to be enabled or not.

Defaults to false

enableLockAndEdit boolean

Enables the partial lock and edit module.

Defaults to false

enableOptionsPane boolean

Gets or sets a value indicating whether options pane is enabled or not.

Defaults to false

enablePageSetupDialog boolean

Gets or sets a value indicating whether font dialog is enabled or not.

Defaults to false

enableParagraphDialog boolean

Gets or sets a value indicating whether paragraph dialog is enabled or not.

Defaults to false

enablePersistence boolean

Enable or disable persisting component’s state between page reloads.

Defaults to false

enablePrint boolean

Gets or sets a value indicating whether print needs to be enabled or not.

Defaults to false

enableRtl boolean

Enable or disable rendering component in right to left direction.

Defaults to false

enableSearch boolean

Gets or sets a value indicating whether search module is enabled or not.

Defaults to false

enableSelection boolean

Gets or sets a value indicating whether selection needs to be enabled or not.

Defaults to false

enableSfdtExport boolean

Gets or sets a value indicating whether Sfdt export needs to be enabled or not.

Defaults to false

enableSpellCheck boolean

Gets or sets a value indicating whether editor need to be spell checked.

Defaults to false

enableStyleDialog boolean

Gets or sets a value indicating whether font dialog is enabled or not.

Defaults to false

enableTableDialog boolean

Gets or sets a value indicating whether table dialog is enabled or not.

Defaults to false

enableTableOfContentsDialog boolean

Gets or sets a value indicating whether table of contents dialog is enabled or not.

Defaults to false

enableTableOptionsDialog boolean

Gets or sets a value indicating whether table options dialog is enabled or not.

Defaults to false

enableTablePropertiesDialog boolean

Gets or sets a value indicating whether table properties dialog is enabled or not.

Defaults to false

enableTextExport boolean

Gets or sets a value indicating whether text export needs to be enabled or not.

Defaults to false

enableTrackChanges boolean

Gets or sets a value indicating whether track changes is enabled or not

Defaults to false

enableWordExport boolean

Gets or sets a value indicating whether word export needs to be enabled or not.

Defaults to false

headers object[]

Adds the custom headers to XMLHttpRequest.

Defaults to []

height string

Defines the height of the DocumentEditor component.

Defaults to ‘200px’

isDocumentEmpty boolean

Describes whether Document contains any content or not

Defaults to false

isReadOnly boolean

Gets or sets a value indicating whether the document editor is in read only state or not.

Defaults to true

layoutType LayoutType

Gets or sets the Layout Type.

Defaults to Pages

locale string

Overrides the global culture and localization value for this component. Default global culture is ‘en-US’.

Defaults to ’’

pageCount number

Gets the total number of pages.

pageGap number

Gets or sets the page gap value in document editor.

Defaults to 20

pageOutline string

Gets or sets the page outline color.

Defaults to ‘#000000’

revisions RevisionCollection

Gets the revision collection which contains information about changes made from original document

search Search

Gets the search object of the document editor.

selection Selection

Gets the selection object of the document editor.

Defaults to undefined

serverActionSettings ServerActionSettingsModel

Defines the settings of the DocumentEditor services

serviceUrl string

Gets or sets the Sfdt Service URL.

Defaults to ’’

showComments boolean

Shows the comment in the document.

Defaults to false

showRevisions boolean

Shows the revision changes in the document.

Defaults to false

spellCheckDialog SpellCheckDialog

Gets the spell check dialog object of the document editor.

spellChecker SpellChecker

Gets the spell check object of the document editor.

useCtrlClickToFollowHyperlink boolean

Gets or sets a value indicating whether holding Ctrl key is required to follow hyperlink on click. The default value is true.

Defaults to true

userColor string

Gets or sets the color used for highlighting the editable ranges or regions of the currentUser in Document Editor. The default value is “#FFFF00”.

If the visibility of text affected due this highlight color matching with random color applied for the track changes, then modify the color value of this property to resolve text visibility problem.

Defaults to ‘#FFFF00’

width string

Defines the width of the DocumentEditor component.

Defaults to ‘100%’

zIndex number

Specifies the z-order for rendering that determines whether the dialog is displayed in front or behind of another component.

Defaults to 2000

zoomFactor number

Gets or sets the zoom factor in document editor.

Defaults to 1

Methods

destroy

Destroys all managed resources used by this object.

Returns void

enableAllModules

Enables all the modules.

Returns void

exportAsImage

Exports the specified page as image.

Parameter	Type	Description
pageNumber	number	Specifies the page number starts from index 1.
format	ImageFormat	Specifies the image format.

Returns HTMLImageElement

exportContentControlData

Exports the content control values.

Parameter	Type	Description
isExportRichTextData (optional)	boolean	Optional flag to export the rich text content control data as Sfdt.

Returns ContentControlInfo[]

exportFormData

Exports the form field values.

Returns FormFieldData[]

fitPage

Fits the page based on given fit type.

Parameter	Type	Description
pageFitType (optional)	PageFitType	The default value of ‘pageFitType’ parameter is ‘None’

Returns void

focusIn

Shifts the focus to the document.

Returns void

getBookmarks

Gets the bookmarks.

Returns string[]

getComments

Gets the entire document’s comment information.

Returns CommentInfo[]

getFormFieldInfo

Gets the form field by name

Parameter	Type	Description
name	string	The form field name.

Returns TextFormFieldInfo | CheckBoxFormFieldInfo | DropDownFormFieldInfo

getFormFieldNames

Gets all the form field names in current document.

Returns string[]

getStyleNames

Gets the style names based on given style type.

Parameter	Type	Description
styleType (optional)	StyleType	Specifies the style type.

Returns string[]

getStyles

Gets the style objects on given style type.

Parameter	Type	Description
styleType (optional)	StyleType	Specifies the style type.

Returns Object[]

importContentControlData

Imports content control data and returns the processed content control information.

Parameter	Type	Description
contentControlInfo	ContentControlInfo[]	The array of content control information to be imported.

Returns ContentControlInfo[]

importFormData

Imports the form field values.

Parameter	Type	Description
formData	FormFieldData[]	Specifies the form field values.

Returns void

open

Opens the given sfdt text or base 64 string or url.

Returns void

openAsync

Opens the given sfdt text or base 64 string or url.

Returns void

openBlank

Opens a blank document.

Returns void

print

Prints the document.

Parameter	Type	Description
printWindow (optional)	Window	Default value of ‘printWindow’ parameter is undefined.

Returns void

resetContentControlData

Resets the content control data.

Parameter	Type	Description
contentControInfo	ContentControlInfo[]	The array of content control information to be reset.

Returns void

resetFormFields

Resets the form field value to default with the specified form field name.

Parameter	Type	Description
name (optional)	string	Specifies the form field name

Returns void

resize

Resizes the component and its sub elements based on given size or container size.

Parameter	Type	Description
width (optional)	number	Specifies the width
height (optional)	number	Specifies the hight

Returns void

save

Saves the document.

Parameter	Type	Description
fileName	string	Specifies the file name.
formatType (optional)	FormatType	Specifies the format type.

Returns void

saveAsBlob

Saves the document as blob.

Parameter	Type	Description
formatType (optional)	FormatType	Specifies the format type.

Returns Promise

scrollToPage

Scrolls view to start of the given page number if exists.

Parameter	Type	Description
pageNumber	number	Specifies the page number.

Returns boolean

serialize

Serializes the data to JSON string.

Returns string

setCustomFonts

Sets custom fonts in the document editor.

Parameter	Type	Description
fonts	string | object[]	A stringified JSON array or an array of objects, where each object defines: - fontFamily: The name of the font family. - src: A URL or relative path pointing to the font file. Example usage: // Using a stringified JSON array documentEditor.setCustomFonts(‘[{fontFamily: “Algerian”, src: “url(‘/fonts/myfont.ttf’) format(‘ttf’)”}, {fontFamily: “Arial”, src: “url(‘https://example.com/font2.ttf’) format(‘ttf’)”}, {fontFamily: “Arial”, src: “url(‘data:font/ttf;base64,d09GRgABAAAAAA…’) format(‘ttf’)”}]’); // Using an array of objects documentEditor.setCustomFonts([ {fontFamily: “Algerian”, src: “url(‘/fonts/myfont.ttf’) format(‘ttf’)”}, {fontFamily: “Arial”, src: “url(‘https://example.com/font2.ttf’) format(‘ttf’)”}, {fontFamily: “Arial”, src: “url(‘data:font/ttf;base64,d09GRgABAAAAAA…’) format(‘ttf’)”} ]);

Returns void

setDefaultCharacterFormat

Sets the default character format for document editor

Parameter	Type	Description
characterFormat	CharacterFormatProperties	Specifies the character format.

Returns void

setDefaultParagraphFormat

Sets the default paragraph format for document editor

Parameter	Type	Description
paragraphFormat	ParagraphFormatProperties	Specifies the paragraph format.

Returns void

setDefaultSectionFormat

Sets the default section format for document editor

Parameter	Type	Description
sectionFormat	SectionFormatProperties	Specifies the section format.

Returns void

setFormFieldInfo

Sets the form field info with the specified name.

Parameter	Type	Description
name	string	Specifies the form field name
formFieldInfo	TextFormFieldInfo | CheckBoxFormFieldInfo | DropDownFormFieldInfo	Form Field info.

Returns void

showDialog

Shows the dialog.

Parameter	Type	Description
dialogType	DialogType	Specifies the dialog type.

Returns void

showOptionsPane

Shows the options pane.

Returns void

showRestrictEditingPane

Shows the restrict editing pane.

Parameter	Type	Description
show (optional)	boolean	Specifies to show or hide restrict editing pane.

Returns void

showXmlPane

Shows the Xml pane.

Returns void

updateFields

Updates the fields in the current document.
Currently cross reference field only supported.

Returns void

verbalizeFromCursorLocation

Triggers the screen reader to verbalize content starting from the current cursor position.

Returns void

Events

actionComplete EmitType<CollaborativeEditingEventArgs>

Triggers when the document editor collaborative actions (such as LockContent, SaveContent, UnlockContent) gets completed.

afterFormFieldFill EmitType<FormFieldFillEventArgs>

Triggers after the form field fill.

beforeAcceptRejectChanges EmitType<RevisionActionEventArgs>

Triggers before accepting or rejecting changes.

beforeCommentAction EmitType<CommentActionEventArgs>

Triggers on comment actions(Post, edit, reply, resolve, reopen).

beforeFileOpen EmitType<BeforeFileOpenArgs>

Triggers before a file is opened.

beforeFormFieldFill EmitType<FormFieldFillEventArgs>

Triggers before the form field fill.

beforePaneSwitch EmitType<BeforePaneSwitchEventArgs>

Triggers before opening the comment pane.

beforePaste EmitType<BeforePasteEventArgs>

This event is triggered before content is pasted in Document Editor.

commentBegin EmitType<Object>

Triggers after inserting the comment.

commentDelete EmitType<CommentDeleteEventArgs>

Triggers after deleting the comment.

commentEnd EmitType<Object>

Triggers after posting the comment.

contentChange EmitType<ContentChangeEventArgs>

Triggers whenever the content changes in the document editor.

contentControl EmitType<Object>

Triggers when user interaction prevented in content control.

created EmitType<Object>

Triggers when the component is created.

customContextMenuBeforeOpen EmitType<BeforeOpenCloseCustomContentMenuEventArgs>

Triggers before opening the custom context-menu option.

customContextMenuSelect EmitType<CustomContentMenuEventArgs>

Triggers while selecting the custom context-menu option.

destroyed EmitType<Object>

Triggers when the component is destroyed.

documentChange EmitType<DocumentChangeEventArgs>

Triggers whenever the document changes in the document editor.

keyDown EmitType<DocumentEditorKeyDownEventArgs>

Triggers whenever the key is pressed in the document editor.

requestNavigate EmitType<RequestNavigateEventArgs>

Triggers whenever the hyperlink is clicked or tapped in the document editor.

searchResultsChange EmitType<SearchResultsChangeEventArgs>

Triggers whenever search results changes in the document editor.

selectionChange EmitType<SelectionChangeEventArgs>

Triggers whenever the selection changes in the document editor.

serviceFailure EmitType<ServiceFailureArgs>

Triggers when the server side action fails.

trackChange EmitType<TrackChangeEventArgs>

Triggers when the trackChanges enabled / disabled.

viewChange EmitType<ViewChangeEventArgs>

Triggers whenever the container view changes in the document editor.

zoomFactorChange EmitType<ZoomFactorChangeEventArgs>

Triggers whenever the zoom factor changes in the document editor.