Show theme settings Shopping cart Download trialFree Trial
> Hi John,
> This is really cool! Thanks for opening my eyes to this!

Hi,
Thanks. I love the feedback :)

--
Regards,
John

P.S. Don't forget to try the new DevExpress ASP.NET MVC Extensions! H
Change Theme Settings
Change Theme Settings
Themes
 
Show All Themes
v
...v

Custom Toolbar Items

  • Undo (Ctrl+Z)
  • Redo (Ctrl+Y)
  • Bold (Ctrl+B)
  • Italic (Ctrl+I)
  • Underline
  • Strikethrough
  • v
  • Smile
    v
  • v
Did this demo address your needs?
If you’d like us to extend this demo further, please describe your needs below.
Thank you in advance for your cooperation.
SEND FEEDBACK


This demo illustrates how you can extend the MVC HTML Editor's toolbar with custom items and implement item-specific functionality.

In addition to standard items available within built-in toolbars, the HTML Editor allows you to add custom items and provide specific functionality for them. The following custom item types are shipped with the MVC HTML Editor:

  • Combo Box (ToolbarComboBox item). A combo box provides a standard dropdown list of individual items. In this demo, you can apply a specific font size to the currently selected content by picking an appropriate combo box item.
  • Dropdown Item Picker (ToolbarDropDownItemPicker item). A dropdown item picker represents a button with a dropdown and contains a list of selectable items. To select an item, users can hover the mouse pointer over a button or click it to activate its dropdown list and then select an item within the list. In this demo, you can insert smilies within the editor via a dropdown item picker.
  • Dropdown Menu (ToolbarDropDownMenu item). A dropdown menu item represents a button that displays a dropdown menu when clicked. In this demo, you can insert the current date and time into the editor by selecting the desired date/time format within the dropdown menu.

To ensure ease of use, these item types provide a common API. Open the demo's Code page to see how you can populate dropdown lists with items and respond to item clicks.

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