Events Class

Contains a list of client-side events for the RichEdit control.

Declaration

export class Events

Properties

activeSubDocumentChanged Property

Enables you to dynamically add (or remove) a handler to (or from) the ActiveSubDocumentChanged event.

Declaration

readonly activeSubDocumentChanged: ActiveSubDocumentChangedEvent

Property Value

The event object.

|

Remarks

The ActiveSubDocumentChanged event occurs when an active sub document is changed.

• JS

richEdit.events.activeSubDocumentChanged.addHandler(function(s, e) { /* your custom actions */ });

You can use the OnActiveSubDocumentChanged(String) method on the server or the activeSubDocumentChanged property on the client to assign a handler to the event.

autoCorrect Property

Enables you to dynamically add (or remove) a handler to (or from) the AutoCorrect event.

Declaration

readonly autoCorrect: AutoCorrectEvent

Property Value

The event object.

|

Remarks

The AutoCorrect event occurs when text is typed in the control. The event handler receives an argument of the AutoCorrectEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.autoCorrect.addHandler(function(s, e) {
  console.log('The inserted text is: ' + e.text);
});

You can use the OnAutoCorrect(String) method on the server or the autoCorrect property on the client to assign a handler to the event.

beforeSend Property

Declaration

readonly beforeSend: BeforeSendEvent

Property Value

calculateDocumentVariable Property

Enables you to dynamically add (or remove) a handler to (or from) the CalculateDocumentVariable event.

Declaration

readonly calculateDocumentVariable: CalculateDocumentVariableEvent

Property Value

The event object.

|

Remarks

The CalculateDocumentVariable event occurs when a DOCVARIABLE field is updated. The event handler receives an argument of the CalculateDocumentVariableEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.calculateDocumentVariable.addHandler(function(s, e) {
  if (e.variableName == 'sectionIndex')
      e.value = (s.document.sections.find(e.fieldInterval.start).index + 1).toString();
});

You can use the OnCalculateDocumentVariable(String) method on the server or the calculateDocumentVariable property on the client to assign a handler to the event.

Note

When the CalculateDocumentVariableAsyncEvent event handler is specified, the CalculateDocumentVariable event does not fire.

calculateDocumentVariableAsync Property

Enables you to dynamically add (or remove) a handler to (or from) the CalculateDocumentVariableAsync event.

Declaration

readonly calculateDocumentVariableAsync: CalculateDocumentVariableAsyncEvent

Property Value

The event object.

|

Remarks

The CalculateDocumentVariableAsync event allows you to update the results of all DOCVARIABLE fields in the document. The event handler receives an argument of the CalculateDocumentVariableAsyncEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.calculateDocumentVariableAsync.addHandler(function(s, e) {
  e.data.forEach(function(data) {
    data.callback('Result Of ' + data.variableName);
  });
});

You can use the OnCalculateDocumentVariableAsync(String) method on the server or the calculateDocumentVariableAsync property on the client to assign a handler to the event.

Note

When the CalculateDocumentVariableAsync event handler is specified, the CalculateDocumentVariable event does not fire.

characterPropertiesChanged Property

Enables you to dynamically add (or remove) a handler to (or from) the CharacterPropertiesChanged event.

Declaration

readonly characterPropertiesChanged: CharacterPropertiesChangedEvent

Property Value

The event object.

|

Remarks

The CharacterPropertiesChanged event occurs when the characters’ formatting is changed. The event handler receives an argument of the ContentChangedEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.characterPropertiesChanged.addHandler(function(s, e) { /* your custom actions */ });

You can use the OnCharacterPropertiesChanged(String) method on the server or the characterPropertiesChanged property on the client to assign a handler to the event.

commandStateChanged Property

Enables you to dynamically add (or remove) a handler to (or from) the CommandStateChanged event.

Declaration

readonly commandStateChanged: CommandStateChangedEvent

Property Value

The event object.

|

Remarks

The CommandStateChanged event occurs after a command state has been changed. The event handler receives an argument of the CommandStateChangedEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.commandStateChanged.addHandler(function(s, e) { /* your custom actions */ });

You can use the OnCommandStateChanged(String) method on the server or the commandStateChanged property on the client to assign a handler to the event.

contentInserted Property

Enables you to dynamically add (or remove) a handler to (or from) the ContentInserted event.

Declaration

readonly contentInserted: ContentInsertedEvent

Property Value

The event object.

|

Remarks

The ContentInserted event occurs when content is inserted into the document. The event handler receives an argument of the ContentChangedEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.contentInserted.addHandler(function(s, e) {
  console.log('The inserted text is: ' + s.document.getText(e.interval));
});

You can use the OnContentInserted(String) method on the server or the contentInserted property on the client to assign a handler to the event.

contentRemoved Property

Enables you to dynamically add (or remove) a handler to (or from) the ContentRemoved event.

Declaration

readonly contentRemoved: ContentRemovedEvent

Property Value

The event object.

|

Remarks

The ContentRemoved event occurs when content is removed from the document. The event handler receives an argument of the ContentRemovedEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.contentRemoved.addHandler(function(s, e) {
  console.log('The removed text is: ' + e.removedText);
});

You can use the OnContentRemoved(String) method on the server or the contentRemoved property on the client to assign a handler to the event.

contextMenuShowing Property

Enables you to dynamically add (or remove) a handler to (or from) the ContextMenuShowing event.

Declaration

readonly contextMenuShowing: ContextMenuShowingEvent

Property Value

The event object.

|

Remarks

The ContextMenuShowing event occurs before a context menu is displayed. The event handler receives an argument of the ContextMenuShowingEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.contextMenuShowing.addHandler(function(s, e) {
  var characterProperties = s.selection.activeSubDocument.getCharacterProperties(s.selection.intervals[0]);
  if (characterProperties.bold === true || characterProperties.bold === undefined) {
    e.contextMenu.removeItem(DevExpress.RichEdit.ContextMenuCommandId.Copy);
    e.contextMenu.removeItem(DevExpress.RichEdit.ContextMenuCommandId.Paste);
    e.contextMenu.removeItem(DevExpress.RichEdit.ContextMenuCommandId.Cut);
    e.contextMenu.insertItem(new DevExpress.RichEdit.ContextMenuItem('CutCopy', {
      icon: 'close', text: 'Copy Paste Disabled', disabled: true
    }), 1);
  }
});

You can use the OnContextMenuShowing(String) method on the server or the contextMenuShowing property on the client to assign a handler to the event.

customCommandExecuted Property

Enables you to dynamically add (or remove) a handler to (or from) the CustomCommandExecuted event.

Declaration

readonly customCommandExecuted: CustomCommandExecutedEvent

Property Value

The event object.

|

Remarks

The CustomCommandExecuted event occurs after a custom command has been executed on the client side. The event handler receives an argument of the CustomCommandExecutedEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.customCommandExecuted.addHandler(function(s, e) {
  switch (e.commandName) {
    case 'sendEmail':
      var text = s.document.getText();
      var mailto_link = 'mailto:[email protected]?subject=Test&body=' + encodeURIComponent(text);
      window = window.open(mailto_link, 'emailWindow');
      if(window && window.open && !window.closed)
        window.close();
      break;
  }
});

You can use the OnCustomCommandExecuted(String) method on the server or the customCommandExecuted property on the client to assign a handler to the event.

documentChanged Property

Enables you to dynamically add (or remove) a handler to (or from) the DocumentChanged event.

Declaration

readonly documentChanged: DocumentChangedEvent

Property Value

The event object.

|

Remarks

The DocumentChanged event occurs if any change is made in the document.

• JS

richEdit.events.documentChanged.addHandler(function(s, e) {
  console.log('The document has been changed.');
});

You can use the OnDocumentChanged(String) method on the server or the documentChanged property on the client to assign a handler to the event.

documentFormatted Property

Enables you to dynamically add (or remove) a handler to (or from) the DocumentFormatted event.

Declaration

readonly documentFormatted: DocumentFormattedEvent

Property Value

The event object.

|

Remarks

The DocumentFormatted event occurs when a document layout is formatted. The event handler receives an argument of the DocumentFormattedEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.documentFormatted.addHandler(function(s, e) {
  console.log('The document contains ' + e.pageCount + ' page(s).');
});

You can use the OnDocumentFormatted(String) method on the server or the documentFormatted property on the client to assign a handler to the event.

documentLoaded Property

Enables you to dynamically add (or remove) a handler to (or from) the DocumentLoaded event.

Declaration

readonly documentLoaded: DocumentLoadedEvent

Property Value

The event object.

|

Remarks

The DocumentLoaded event occurs when a document model is loaded into the control.

• JS

richEdit.events.documentLoaded.addHandler(function(s, e) {
  console.log('The document has been loaded');
});

You can use the OnDocumentLoaded(String) method on the server or the documentLoaded property on the client to assign a handler to the event.

gotFocus Property

Enables you to dynamically add (or remove) a handler to (or from) the GotFocus event.

Declaration

readonly gotFocus: GotFocusEvent

Property Value

The event object.

|

Remarks

The GotFocus event occurs when the control receives focus.

• JS

richEdit.events.gotFocus.addHandler(function(s, e) { /* your custom actions */ });

You can use the OnGotFocus(String) method on the server or the gotFocus property on the client to assign a handler to the event.

horizontalRulerVisibleChanged Property

Allows you to dynamically add/remove a handler from the HorizontalRulerVisibleChanged event.

Declaration

readonly horizontalRulerVisibleChanged: HorizontalRulerVisibleChangedEvent

Property Value

The event object.

|

Remarks

The HorizontalRulerVisibleChanged event fires when horizontal ruler visibility changes. Event handlers use argument properties of the ParagraphPropertiesChangedEventArgs type.

• JS

richEdit.events.horizontalRulerVisibleChanged.addHandler(function(s, e) {
  console.log('The horizontal ruler visibility has changed.');
});

hyperlinkClick Property

Enables you to dynamically add (or remove) a handler to (or from) the HyperlinkClick event.

Declaration

readonly hyperlinkClick: HyperlinkClickEvent

Property Value

The event object.

|

Remarks

The HyperlinkClick event occurs when a hyperlink is clicked. The event handler receives an argument of the HyperlinkClickEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.hyperlinkClick.addHandler(function(s, e) {
  console.log('Navigates to ' + e.hyperlink.hyperlinkInfo.url);
});

You can use the OnHyperlinkClick(String) method on the server or the hyperlinkClick property on the client to assign a handler to the event.

keyDown Property

Enables you to dynamically add (or remove) a handler to (or from) the KeyDown event.

Declaration

readonly keyDown: KeyDownEvent

Property Value

The event object.

|

Remarks

The KeyDown event occurs when a key is pressed while the RichEdit’s document has focus. The event handler receives an argument of the KeyboardEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.keyDown.addHandler(function(s, e) {
  console.log('The pressed key is: ' + e.htmlEvent.key);
});

You can use the OnKeyDown(String) method on the server or the keyDown property on the client to assign a handler to the event.

keyUp Property

Enables you to dynamically add (or remove) a handler to (or from) the KeyUp event.

Declaration

readonly keyUp: KeyUpEvent

Property Value

The event object.

|

Remarks

The KeyUp event occurs when a key is released while the RichEdit’s document has focus. The event handler receives an argument of the KeyboardEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.keyUp.addHandler(function(s, e) {
  console.log('The released key is: ' + e.htmlEvent.key);
});

You can use the OnKeyUp(String) method on the server or the keyUp property on the client to assign a handler to the event.

lostFocus Property

Enables you to dynamically add (or remove) a handler to (or from) the LostFocus event.

Declaration

readonly lostFocus: LostFocusEvent

Property Value

The event object.

|

Remarks

The LostFocus event occurs when the control loses focus.

• JS

richEdit.events.lostFocus.addHandler(function(s, e) { /* your custom actions */ });

You can use the OnLostFocus(String) method on the server or the lostFocus property on the client to assign a handler to the event.

paragraphPropertiesChanged Property

Enables you to dynamically add (or remove) a handler to (or from) the ParagraphPropertiesChanged event.

Declaration

readonly paragraphPropertiesChanged: ParagraphPropertiesChangedEvent

Property Value

The event object.

|

Remarks

The ParagraphPropertiesChanged event occurs when a paragraph’s formatting is changed. The event handler receives an argument of the ParagraphPropertiesChangedEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.paragraphPropertiesChanged.addHandler(function(s, e) { /* your custom actions */ });

You can use the OnParagraphPropertiesChanged(String) method on the server or the paragraphPropertiesChanged property on the client to assign a handler to the event.

pdfExported Property

Enables you to dynamically add (or remove) a handler to (or from) the PdfExported event.

Declaration

readonly pdfExported: PdfExportedEvent

Property Value

The event object.

|

Remarks

The PdfExported event occurs after an exported PDF document has been processed on the server side. The event handler receives an argument of the PdfExportedEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.pdfExported.addHandler(function(s, e) {
  if (e.success)
    console.log('The PDF document is successfully processed on the server.');
});

You can use the OnPdfExported(String) method on the server or the pdfExported property on the client to assign a handler to the event.

pdfExporting Property

Enables you to dynamically add (or remove) a handler to (or from) the PdfExporting event.

Declaration

readonly pdfExporting: PdfExportingEvent

Property Value

The event object.

|

Remarks

The PdfExporting event allows you to save an exported PDF document. The event handler receives an argument of the PdfExportingEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.pdfExporting.addHandler(function(s, e) {
    e.handled = true;
    console.log(e.base64);
});

You can use the OnPdfExporting(String) method on the server or the pdfExporting property on the client to assign a handler to the event.

pointerDown Property

Enables you to dynamically add (or remove) a handler to (or from) the PointerDown event.

Declaration

readonly pointerDown: PointerDownEvent

Property Value

The event object.

|

Remarks

For a mouse pointer, the PointerDown event occurs when a user presses a mouse button or wheel while the mouse pointer is over the Rich Text Editor. For touch and pen pointers, this event occurs when a pointer contacts a digitizer.

The event handler receives an argument of the PointerEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.pointerDown.addHandler(function(s, e) { /* your custom actions */ });

You can use the OnPointerDown(String) method on the server or the pointerDown property on the client to assign a handler to the event.

pointerUp Property

Enables you to dynamically add (or remove) a handler to (or from) the PointerUp event.

Declaration

readonly pointerUp: PointerUpEvent

Property Value

The event object.

|

Remarks

For a mouse pointer, the PointerUp event occurs when a user releases a mouse button or wheel while the mouse pointer is over the Rich Text Editor. For touch and pen pointers, this event occurs when a pointer stops physical contact with a digitizer.

The event handler receives an argument of the PointerEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.pointerUp.addHandler(function(s, e) { /* your custom actions */ });

You can use the OnPointerUp(String) method on the server or the pointerUp property on the client to assign a handler to the event.

saved Property

Enables you to dynamically add (or remove) a handler to (or from) the Saved event.

Declaration

readonly saved: SavedEvent

Property Value

The event object.

|

Remarks

The Saved event occurs after a document is saved on the server side. The event handler receives an argument of the SavedEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.saved.addHandler(function(s, e) {
    if (e.success)
      console.log('The document is successfully processed on the server.');
});

You can use the OnSaved(String) method on the server or the saved property on the client to assign a handler to the event.

saving Property

Enables you to dynamically add (or remove) a handler to (or from) the Saving event.

Declaration

readonly saving: SavingEvent

Property Value

The event object.

|

Remarks

The Saving event allows you to save a document. The event handler receives an argument of the SavingEventArgs type. The argument’s properties provide information specific to this event.

• JS

richEdit.events.saving.addHandler(function(s, e) {
  e.handled = true; 
  console.log(e.base64);
  console.log(e.fileName);
  console.log(e.format);
});

You can use the OnSaving(String) method on the server or the saving property on the client to assign a handler to the event.

selectionChanged Property

Enables you to dynamically add (or remove) a handler to (or from) the SelectionChanged event.

Declaration

readonly selectionChanged: SelectionChangedEvent

Property Value

The event object.

|

Remarks

The SelectionChanged event occurs when selection is changed in the document.

• JS

richEdit.events.selectionChanged.addHandler(function(s, e) {
  console.log('The current position is ' + s.selection.active);
});

You can use the OnSelectionChanged(String) method on the server or the selectionChanged property on the client to assign a handler to the event.

Methods

clear Method

Removes all client event handlers.

Declaration

clear(): void

Remarks

• JS

richEdit.events.clear();