New to Kendo UI for Angular? Start a free 30-day trial

Adding Custom Plugin that Inserts Hard Break on Enter in the Editor


ProductProgress® Kendo UI® for Angular Editor


How to add a custom plugin to the Editor component that will insert a hard break when pressing the Enter key?


To learn how to add custom plugins to the Editor component, refer to the Custom Plugins article.

  1. Create a custom plugin by using the keymap function. Bind the Enter key press event to the plugin, overriding the default behavior and enabling it to replace the current selection with a hard_break node.

  2. Replace the selection with a hard_break node and modify the selection position to ensure the cursor stays in the correct place. This is done by creating a new transaction (tr) and setting the selection's anchor position to newPos.

  3. Associate the newly created custom plugin with the Editor component by utilizing the plugins property.

The following example demonstrates how to add a custom plugin that will insert a hard break on Enter key press.

View Source
Change Theme:

In this article

Not finding the help you need?