Can the CKEditor be used in a WinForms application for (X)HTML editing?

Question

I have adapted the code from winforms html editor to C# (see below). Is it possible to use the CKEditor instead?

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace WebEditorTest
{
/// <summary>
/// https://stackoverflow.com/questions/214124/winforms-html-editor
/// </summary>
public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();
    }

    private void Form1_Load(object sender, EventArgs e)
    {
        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");
        }
        foreach (HtmlElement el in webBrowser1.Document.All.GetElementsByName("editable"))
        {
            el.SetAttribute("width", webBrowser1.Width + "px");
            el.SetAttribute("height", "100%");
            el.SetAttribute("contenteditable", "true");
        }
        webBrowser1.Document.DomDocument.GetType().GetProperty("designMode").SetValue(webBrowser1.Document.DomDocument, "on", null);
        webBrowser1.IsWebBrowserContextMenuEnabled = false;
    }

    private void button1_Click(object sender, EventArgs e)
    {
        textBoxMarkup.Text = webBrowser1.DocumentText;
    }
}
}

LouD · Answer 1 · 2013-08-15T18:32:48.887

4

Yes. Since you are already using the WebBrowser control, there is nothing stopping you from loading an HTML page containing CKEditor and interacting with it through the DOM and InvokeScript.

UPDATE - Here's a working example of interaction:

form.cs

public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();
    }

    private void Form1_Load(object sender, EventArgs e)
    {
        webBrowser1.Navigate("C:\\blank.htm");
        Application.DoEvents();
    }

    private void button1_Click(object sender, EventArgs e)
    {
        webBrowser1.Document.InvokeScript("InitEditor");
    }
}

blank.htm

<html>
    <head>
        <script src='http://ckeditor.com/apps/ckeditor/4.2/ckeditor.js?mriyyd'></script>
        <script type='text/javascript'>
            function InitEditor() { CKEDITOR.replace('editor1'); }
        </script>
    </head>
    <body>
        <textarea cols='80' id='editor1' name='editor1' rows='10'>
            <span>Lorem Ipsum</span>
        </textarea>
    </body>
</html>

edited Aug 15 '13 at 18:32

answered Jun 24 '13 at 11:41

LouD

3,776
4
19
17

Actually permission denied that could stop you a bit from loading scripts into your webbrowser control. – Constantin Aug 14 '13 at 16:23
How so? There is no cross domain or same origin issue here since he is creating the page on the fly. Several examples on SO: http://stackoverflow.com/questions/153748/how-to-inject-javascript-in-webbrowser-control. – LouD Aug 14 '13 at 21:15
All that examples show how to inject a snippet of js code into your page. But CKEditor isn't just a snippet of js, there are a lot of external js that must be included, and here is where the permission denied comes in :) – Constantin Aug 15 '13 at 13:39
No need to inject all of CKEditor, you can inject a script tag to load all of that. No different than pulling it or other libraries like jquery from an external CDN. Same original policy doesn't apply to script loading: http://stackoverflow.com/questions/10530554/why-is-the-html-script-tag-not-subject-to-the-same-origin-policy – LouD Aug 15 '13 at 16:26
are you talking from your own experience or just keep on googling ? because i had this issue of loading an external js file in my dynamic html generated content and i am telling you that the IE will not let you load that script, throwing the permission denied error. – Constantin Aug 15 '13 at 16:50
Yes, I've included external scripts before, not an issue. But I'll admit that I hadn't tried CKEditor until a few minutes ago. Seems as though your issue isn't related to loading scripts, but rather using "about:blank". That causes the document.domain variable to be set to null which CKE checks when loading the spell checker and the original iframe window (though the toolbars are rendered fine). If I just switch to loading the base page from the local disk, everything works great. I'll add the example to my answer. – LouD Aug 15 '13 at 18:30
Yes i get it, me i was starting to navigate with the "about:blank" and adding elements and scripts. Now it's clear why it was going insane with that permission. – Constantin Aug 15 '13 at 18:58

score 1 · Answer 2 · answered Oct 06 '13 at 03:55

Speaking from experience you can most certainly use CKEditor in WinForms applications. I detailed what I did in http://www.sheldmandu.com/programming/wysiwyg-html-editor-in-dotnet-wpf-windows-forms-vb6-in-web-browser I'm actually now at a point where I'm going to write a control for it as it's a bit annoying doing things manually in every project or copying code.

Can the CKEditor be used in a WinForms application for (X)HTML editing?

2 Answers2

Linked