winforms html editor

You can use the WebBrowser control in design mode with a second WebBrowser control set in view mode.

In order to put the WebBrowser control in design mode, you can use the following code.

This code is a super stripped down version of a WYSIWYG editor for one of our software products.

Simply create a new Form, drop a WebBrowser control on it, and put this in the Form.Load:

Me.WebBrowser1.Navigate("")
Application.DoEvents()
Me.WebBrowser1.Document.OpenNew(False).Write("<html><body><div id=""editable"">Edit this text</div></body></html>")

'turns off document body editing
For Each el As HtmlElement In Me.WebBrowser1.Document.All
    el.SetAttribute("unselectable", "on")
    el.SetAttribute("contenteditable", "false")
Next

'turns on editable div editing
With Me.WebBrowser1.Document.Body.All("editable")
    .SetAttribute("width", Me.Width & "px")
    .SetAttribute("height", "100%")
    .SetAttribute("contenteditable", "true")
End With

'turns on edit mode
Me.WebBrowser1.ActiveXInstance.Document.DesignMode = "On"
'stops right click->Browse View
Me.WebBrowser1.IsWebBrowserContextMenuEnabled = False


//CODE in C#
webBrowser1.Navigate("about:blank");
Application.DoEvents();
webBrowser1.Document.OpenNew(false).Write("<html><body><div id=\"editable\">Edit this text</div></body></html>"); 

foreach (HtmlElement el in webBrowser1.Document.All)
{
    el.SetAttribute("unselectable", "on");
    el.SetAttribute("contenteditable", "false");
}

webBrowser1.Document.Body.SetAttribute("width", this.Width.ToString() + "px");    
webBrowser1.Document.Body.SetAttribute("height", "100%");     
webBrowser1.Document.Body.SetAttribute("contenteditable", "true");
webBrowser1.Document.DomDocument.GetType().GetProperty("designMode").SetValue(webBrowser1.Document.DomDocument, "On", null);
webBrowser1.IsWebBrowserContextMenuEnabled = false;

SpiceLogic .NET WinForms HTML Editor Control, not free, but it covers everything whatever you are looking for. Especially, Paste from MS word feature is really efficient. Clicking that MS Word Paste button will paste the content from Clipboard to the Editor and clean up the ms word specific tags and generate clean XHTML. If the MS Word contains some images, this editor will detect those images too and the output XHTML will contain the image tag with correct paths for those images.

https://www.spicelogic.com/Products/NET-WinForms-HTML-Editor-Control-8

enter image description here


I'm considering using Writer by Lutz Roeder (of Reflector fame). A basic Html editor written completely in C#, provided as-is with source code. Look for it at http://www.lutzroeder.com/dotnet/

Tags:

C#

Html

.Net

Winforms

Recent Posts