All Components
Change Theme

SASS Themes (beta)

    LESS Themes

      SASS Theme Builder

      Create new or customize SASS themes
      Launch Theme Builder

      Editor / Immutable Elements

      Company Name


      1010 Street,
      City,
      Country,
      +000 000 555 666

      Dear Your Name,

      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vel nunc velit. Proin dictum ac justo eu varius. Fusce vehicula, erat ac sagittis consequat, leo libero tristique dolor, et maximus eros ante quis quam. Aliquam erat volutpat. Cras nec mattis dui, sed rhoncus magna. Maecenas eget tristique nibh. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras nec nisl elementum, rhoncus ligula at, fringilla odio. Curabitur semper ultricies tristique. Donec dapibus placerat dui nec fermentum. Nunc non cursus nibh. Nulla rhoncus vitae erat id facilisis.

      Aenean lacinia eros eu interdum placerat. Pellentesque elit tellus, condimentum eu nulla quis, iaculis gravida sapien. Aliquam elementum dapibus eros sed pretium. Praesent porta odio magna, nec efficitur arcu pharetra a. Nulla lacus orci, pretium eu pellentesque id, ornare eget turpis. Quisque condimentum quam ante, ornare cursus nisl suscipit ac. Nulla non leo semper, finibus mauris eu, interdum ex.

      Best regards,

      Your Name

      1010 Street,
      City,
      Country,
      +000 000 555 666

      Description

      The Kendo UI Editor widget and its Immutable Elements feature enables you to predefine elements in the content area that cannot be edited by the end user. 

      This demo shows a use case where a mail form is to be edited. You can see also:

      1. How to enable the Immutable Elements—by using the immutables option;
      2. How to define the HTML elements that cannot be edited—by adding the contenteditable='false' attribute;
      3. How to use the immutables.serialization and immutables.deserialization option to change the data shown in the viewHtml dialog and enable end user to control the CSS text-align property from there;
      4. How to define default styles for the immutable elements;
      5. And how to define styles when an immutable element is selected to improve UX.

      HTML5/JavaScript source

      Also available for:

      API Reference
      • immutable-elements.html
      • Widget configuration

      Support & learning resources

      Editor for other technologies