Show theme settings Shopping cart Download trialFree Trial
Change Theme Settings
Change Theme Settings
Themes
 
Show All Themes
v
...v

Html Editing

  • Cut (Ctrl+X)
  • Copy (Ctrl+C)
  • Paste (Ctrl+V)
  • Paste from Word
  • Undo (Ctrl+Z)
  • Redo (Ctrl+Y)
  • Remove Format
  • Superscript
  • Subscript
  • Ordered List
  • Bullet List
  • Indent
  • Outdent
  • Insert Link (Ctrl+K)
  • Remove Link (Ctrl+Shift+K)
  • Insert Image (Ctrl+G)
  • Insert Table
    v
  • Find and Replace (Ctrl+H)
  • Full Screen (F11)
  • v
  • v
  • v
  • Bold (Ctrl+B)
  • Italic (Ctrl+I)
  • Underline
  • Strikethrough
  • Align Left (Ctrl+L)
  • Align Center (Ctrl+E)
  • Align Right (Ctrl+R)
  • Back Color
    v
  • Fore Color
    v
Content Filtering
v
Content Editing
v
v
Apply Changes


The DevExpress HTML Editor is a rich-text WYSIWYG HTML editor extension for ASP.NET MVC. Its intuitive user interface enables even the least experienced users to edit HTML page content with ease. This demo describes some of the features available to you when using the MVC HTML Editor.

The HTML ditor automatically performs validation, editing and filtering of the entered HTML code and is able to remove all potentially harmful code. The editor exposes several options, allowing you to control required automatic transformations.

Content Filtering

Use the AllowScripts, AllowIFrames, AllowFormElements, AllowIdAttributes, and AllowStyleAttributes properties (available by the SettingsHtmlEditing property) to control whether tags and attributes of certain predefined types - scripts, IFRAME, form elements, ID attributes, and style attributes respectively - are allowed within the editor's HTML code.

The AllowedDocumentType property specifies the document types that are allowed within the editor. The available options are: XHTML 1.0 Transitional, HTML 5, or both. HTML code entered into the editor's HTML View is automatically transformed according to the specified document type.

Content Editing

The UpdateDeprecatedElements and UpdateBoldItalic properties (available by the SettingsHtmlEditing property) specify replacement of deprecated elements (such as u, s, strike, font, center) with valid analogs and converting B and I elements into the STRONG and EM elements, respectively.

The SettingsHtmlEditing .ResourcePathMode property specifies if resource paths should be changed to absolute, relative, or root relative.

The Settings.AllowCustomColorsInColorPickers property specifies whether an end-user can specify a custom color in editor color buttons.

The SettingsHtmlEditing.EnterMode property allows you to specify the editor's behavior when the ENTER key is pressed by an end-user - you can choose between a paragraph or line break rendering.

The SettingsHtmlEditing .AllowEditFullDocument property specifies if end-users can edit full document content or the body tag content only.

Note: The demos presented here illustrate the use of custom images (which are uploaded to the server via callbacks) and ways to process/save them on the server. The SettingsImageUpload.UploadImageFolder property is set to a Controller variable, specifying the server folder used to store uploaded images, and the UploadCallbackRouteValues property is used to reference the Controller's method that processes each uploaded image. This method calls the HTMLEditorExtension.SaveUploadedImage static method in order to validate the image and save it to the specified server folder.

Collapse/Expand
Local Copy of this Demo
To inspect the source code for this demo on your machine, you must first install our components via the DevExpress Component Installer.
You can open a local copy of this online demo directly from this webpage (if using v20.2.8, 21.1.4 or higher).
Open CS Solution
The source code files for this demo are installed (by default) in the following directory:
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\CS\MVCxHTMLEditorDemos