New to Kendo UI for jQuery? Download free 30-day trial

Inline editing

Loading Demo...
  • inline-editing.html

Also available for:



This example shows how you can use the Kendo UI Editor to edit parts of the page inline and simultaneously have an overview of the real layout and appearance.

All you need to do to enable the inline editing is to set a css class with display: inline-block setting to an html element, where the element should be a valid contentEditable element as the "divs" rendered in this demo. If such a configuration is not set, the WYSIWYG editor will be rendered in its default textarea mode.


Editor widgets instantiated from a contentEditable elementwill not post their value to the server when submitted within a form.If you need to submit these, see thehow to post the inline editor value help section.

Support & Learning Resources