Set Data With Document.InvokeScript And JavaScript Code

Question

I embeded TinyMCE codes in webBrowser control and used as an HTML editor. Getting data do not provide error but setting data occurs problem. Here is my codes:

public partial class TinyMCE : UserControl
{
    public TinyMCE()
    {
        InitializeComponent();
    }

    public string HTML
    {
        get
        {
            var content = string.Empty;
            if (webBrowserControl.Document != null)
            {
                if (webBrowserControl.Document.Body != null)
                {
                    var html = webBrowserControl.Document.InvokeScript("GetContent");
                    content = html.ToString();
                }
            }

            return content;
        }
        set
        {
            if (webBrowserControl.Document != null)
            {
                //MessageBox.show("bug...");
                webBrowserControl.Document.InvokeScript("SetContent",
                    new object[] { value });
            }
        }
    }
}

I am using it like this: tinyMCE1.HTML = "Some HTML data in here.";

Here is the embeded HTML code:

<!DOCTYPE html>
<html>
<script type="text/javascript" src="tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
    function GetContent()
    {
        return tinyMCE.activeEditor.getContent();
    }

    function SetContent(htmlContent)
    {
        tinyMCE.activeEditor.setContent(htmlContent);
    }
</script>
<script type="text/javascript">
    tinyMCE.init({
      oninit : function() {
        tinyMCE.get('tinyMceEditor').execCommand('mceFullScreen');
      },
      mode: "textareas",
      skin: "o2k7",
      theme: "advanced",
      plugins: "fullpage,pagebreak,style,fullscreen",
      theme_advanced_buttons1: "bold, italic, underline, strikethrough, |, justifyleft, justifycenter, justifyright, justifyfull, |, bullist, numlist, |, outdent, indent, |, undo, redo, |, forecolor, backcolor, |, formatselect,fontselect,fontsizeselect, hr, |, sub, sup, |, pagebreak",
      theme_advanced_buttons2: "",
      theme_advanced_toolbar_location: "top",
      theme_advanced_toolbar_align: "left",
      theme_advanced_resizing: false,
      extended_valid_elements: "a[name|href|target|title|onclick],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]"
    });
</script>
<body>
  <form method="post">
      <textarea name="tinyMceEditor" cols="1" rows="1" style="width:100%; height: 100%"></textarea>
  </form>
</body>
</html>

This is not working but when I add a silly messagebox, it works. I don't understand why it is.

It could have something to do with that the tinyMCE plugin is not fully loaded right away, but when you have a messagebox you give the page more time to load? — nbokmans, Apr 15 '18 at 21:19
@nbokmans, But when I want to get data, there is no problem... — , Apr 16 '18 at 08:04

score 0 · Answer 1 · answered Apr 16 '18 at 18:13

Today, when I told with my dear friend Tansel, he told me to use Application.DoEvents();. I also saw that the problem was solved when I used Application.DoEvents(); instead of MessageBox.Show("A silly solution..."); on it. Thanks Tansel for this nice idea.

Set Data With Document.InvokeScript And JavaScript Code

1 Answers1