尝试在模态弹出窗口（部分视图）中第二次打开tinymce编辑器时出现问题。

问题描述

我需要使用MVC 3构建联系我们表单，并将tincymce 4.1.2实现为文本编辑器。

我面临的问题是，第一次打开模态弹出窗口即联系我们表格时，tincemce编辑器在modalup中可见，但在关闭模态弹出窗口后，当我关闭时试图重新打开模式弹出窗口第二次tincemce编辑器在模态弹出窗口中不再可见。我也尝试了下面的代码片段然后还有tinymce编辑器没有来。

tinyMCE.execCommand（mceRemoveControl，false，elm1）

我写的代码是给予以下参考 -



Index.cshtml（用于打开模态弹出窗口的脚本）

I have a requirement to built ‘Contact Us’ Form using MVC 3 and implement tincymce 4.1.2 as text editor.
The problem i am facing is, for the first when I am opening the modal popup i.e. ‘Contact Us’ Form , the tincemce editor is visible in modalup, but after closing the modal popup and when I am trying to re-open the modal popup for second time tincemce editor is not visible any more in the modal popup. I also tried bellow code snippet then also tinymce editor is not coming.
tinyMCE.execCommand("mceRemoveControl", false, "elm1")
The code i have written is given bellow for reference –

Index.cshtml (Script used to open modal popup)

<script src="@Url.Content("~/Scripts/tinymce/tinymce.min.js")" type="text/javascript"></script>



<script type="text/javascript">
    $(function () {
        $('.modal').click(function () {
            $('<div/>').appendTo('body').dialog({
                close: function (event, ui) {
                    dialog.remove();
                },
                modal: true,
                height: 800,
                width: 800,
            }).load(this.href, {});

            return false;
        });
    });
</script>
@Html.ActionLink("show modal", "modal", null, new { @class = "modal" })

ContactUs.cshtml（模态弹出窗口内的部分视图）

ContactUs.cshtml (Partial View inside modal popup)

@model MvcApplication.Models.BlogPost
<script>
            tinymce.init({
                selector: "textarea#elm1",
                theme: "modern",
                 
                plugins: [
                     "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",
                     "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
                     "save table contextmenu directionality emoticons template paste textcolor"
                ],
                content_css: "css/content.css",
                toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l      ink image | print preview media fullpage | forecolor backcolor emoticons",
                style_formats: [
                     { title: 'Bold text', inline: 'b' },
                     { title: 'Red text', inline: 'span', styles: { color: '#ff0000' } },
                     { title: 'Red header', block: 'h1', styles: { color: '#ff0000' } },
                     { title: 'Example 1', inline: 'span', classes: 'example1' },
                     { title: 'Example 2', inline: 'span', classes: 'example2' },
                     { title: 'Table styles' },
                     { title: 'Table row 1', selector: 'tr', classes: 'tablerow1' }
                ]
            });
            
    </script>
  
@using (Html.BeginForm()) {
    
    @Html.ValidationSummary(true)

    <fieldset>
         

        <div class="editor-label">
            @Html.LabelFor(model => model.Title)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Title)
            @Html.ValidationMessageFor(model => model.Title)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Content)
        </div>
        <div class="editor-field">
            @Html.TextAreaFor(model => model.Content, new { @id = "elm1" })
            @Html.ValidationMessageFor(model => model.Content)
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>


    </fieldset>
}

因此，如果有人帮助我，我会感激不尽在这个问题上。





谢谢，

Dipak。

Hence would be thankful, if any one help me on this issue.


Thanks,
Dipak.

推荐答案

ContactUs.cshtml（模态弹出窗口内的部分视图）

ContactUs.cshtml (Partial View inside modal popup)

@model MvcApplication.Models.BlogPost
<script>
            tinymce.init({
                selector: "textarea#elm1",
                theme: "modern",
                 
                plugins: [
                     "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",
                     "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
                     "save table contextmenu directionality emoticons template paste textcolor"
                ],
                content_css: "css/content.css",
                toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l      ink image | print preview media fullpage | forecolor backcolor emoticons",
                style_formats: [
                     { title: 'Bold text', inline: 'b' },
                     { title: 'Red text', inline: 'span', styles: { color: '#ff0000' } },
                     { title: 'Red header', block: 'h1', styles: { color: '#ff0000' } },
                     { title: 'Example 1', inline: 'span', classes: 'example1' },
                     { title: 'Example 2', inline: 'span', classes: 'example2' },
                     { title: 'Table styles' },
                     { title: 'Table row 1', selector: 'tr', classes: 'tablerow1' }
                ]
            });
            
    </script>
  
@using (Html.BeginForm()) {
    
    @Html.ValidationSummary(true)

    <fieldset>
         

        <div class="editor-label">
            @Html.LabelFor(model => model.Title)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Title)
            @Html.ValidationMessageFor(model => model.Title)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Content)
        </div>
        <div class="editor-field">
            @Html.TextAreaFor(model => model.Content, new { @id = "elm1" })
            @Html.ValidationMessageFor(model => model.Content)
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>


    </fieldset>
}

因此，如果有人帮助我，我会感激不尽在这个问题上。





谢谢，

Dipak。

Hence would be thankful, if any one help me on this issue.


Thanks,
Dipak.

这篇关于尝试在模态弹出窗口（部分视图）中第二次打开tinymce编辑器时出现问题。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！