winforms html editor [closed]

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

Leave a Comment