load html file as initial content in tinymce edito

2019-08-12 20:10发布

问题:

I have set up tinymce in my asp.net mvc project. I want to load a html file into TinyMCE editor content, which is located at another destination.

I followed the tiny Documentation but it is a bit confusing to give a path to my html file.

tinyMCE.activeEditor.setContent('<span>some</span> html');

this is my cshtml file

@{ }
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>TinyMCE Example</title>
    <!-- TinyMCE Script Reference -->
    <script src="~/scripts/tinymce/tinymce.min.js"></script>
    <!-- Script to wire up your TinyMCE editor -->
    <script type="text/javascript" src="~/Scripts/tinymce/tinymce.min.js"></script>
    <script type="text/javascript">
        tinymce.init({

            selector: "textarea",
            theme: "modern",
            plugins: [
        "advlist autolink lists link image charmap print preview hr anchor pagebreak",
        "searchreplace wordcount visualblocks visualchars code fullscreen",
        "insertdatetime media nonbreaking save table contextmenu directionality",
        "emoticons template paste textcolor colorpicker textpattern imagetools"
    ],
    toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
    toolbar2: "print preview media | forecolor backcolor emoticons",
    image_advtab: true,
    templates: [
        {title: 'Test template 1', content: 'Test 1'},
        {title: 'Test template 2', content: 'Test 2'}
    ],

});
        tinyMCE.activeEditor.setContent(Html);
        </script>
</head>
<body>
    <!-- This will automatically post to your Index method (that is decorated with a HttpPost attribute) -->
    @using (Html.BeginForm())
    {
        @Html.AntiForgeryToken()
        <div>
            <!-- This will contain your HtmlContent and use the TinyMCE editor-->
            @Html.TextAreaFor(model => model.HtmlContent)

            <input type="submit" value="Create" />
        </div>
    }
</body>
</html>

This question also relates to my question but it doesn't include a description of how to give the html file a path

UPDATE 1:

I tried to load html using jquery into a TinyMCE textarea, its described in this question

    @section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    @Scripts.Render("~/bundles/jqueryui")


<script type="text/javascript">

    $.get("myhtml.html", function (content) {

        tinyMCE.activeEditor.setContent(content);
    });

</script>
}

but seems like its also not working

回答1:

You cannot give a path to the setContent function directly. What you need to do is to get the html file contents backendside and send it to your page where you insert it into your editor using the setContent method.