How are HTML editor controls implemented in web pages?

Posted: (EET/GMT+2)

 

Almost every web mail provider supplies user with an HTML editor, with which you can author your e-mail messages by choosing the font, color, and so forth. You might also be aware of many third-part components implementing such editors, for example from big-name vendors such as DevExpress, Telerik and ComponentArt, to name a few.

But how are these editors actually implemented? If you wanted to have a similar editor on your own ASP.NET web applications, how would you start? The answer lies in a special HTML DOM (DHTML) property called "designMode", which is documented on MSDN.

This property can be set to "On", after which the specified element can be edited directly in the browser. The commercial (or open-source, as you prefer) components simply have additional buttons on top to specify fonts, formatting, and the like with a nice, appealing look. But essentially, it all starts designMode property.