Symfony2 + TinyMCE->极端文本区域错误

Question

我当前正在使用Symfony2和一个引导模板。 我想将TinyMCE的极端文本区域之一用作时事通讯，但是在使其工作时却遇到了问题。

这是模板的链接，您可以在其中查看文本区域： http : //devoops.me/themes/devoops/#ajax/forms_layouts.html

它带有一个通用的js脚本。 有一个启动tinymce函数：

function TinyMCEStart(elem, mode) {
    var plugins = [];
    if (mode == 'extreme') {
        plugins = ["advlist anchor autolink autoresize autosave bbcode charmap code contextmenu directionality ",
            "emoticons fullpage fullscreen hr image insertdatetime layer legacyoutput",
            "link lists media nonbreaking noneditable pagebreak paste preview print save searchreplace",
            "tabfocus table template textcolor visualblocks visualchars wordcount"];
    }
    <!-- ADDED BY ME
    tinyMCE.baseURL = 'http://'+location.host+resourcesUrl+"/plugins/tinymce";
    tinyMCE.baseURI.setPath(resourcesUrl+"/plugins/tinymce");
    tinyMCE.documentBaseURL = 'http://'+location.host+'/ormindo/web/';
    -->
    tinyMCE.init({selector: elem,
        theme: "modern",
        plugins: plugins,
        //content_css: "css/style.css",
        toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image | print preview media fullpage | forecolor backcolor emoticons",
        style_formats: [
            {title: 'Header 2', block: 'h2', classes: 'page-header'},
            {title: 'Header 3', block: 'h3', classes: 'page-header'},
            {title: 'Header 4', block: 'h4', classes: 'page-header'},
            {title: 'Header 5', block: 'h5', classes: 'page-header'},
            {title: 'Header 6', block: 'h6', classes: 'page-header'},
            {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'}
        ]
    });
}

在摆弄模板时，我得出以下结论：

<textarea class="form-control" rows="5" id="wysiwig_full"></textarea>
<script type="text/javascript">
$(document).ready(function() {
    TinyMCEStart('#wysiwig_full', 'extreme');
});
</script>

足以随时将文本区域转换为TinyMCE极端文本编辑器。

问题在于使它与Symfony生成的表单一起使用。 我尝试了第一种方法，不是最漂亮的方法，但至少它做了点什么（脚本中添加了{％javascripts％}）：

$(document).ready(function() {   
// Create Wysiwig editor for textarea
TinyMCEStart('#ormindo_newsletterbundle_newslettermessage_contents', 'extreme');
});

确实可以，但是只有一次。 如果我加载另一个ajax内容并返回，则textarea将是标准的内容。 这样做时检查页面不会产生任何javascript错误。

为了分解问题，我将Symfony（或者我应该说Twig）生成的原始html复制/粘贴到关联的twig文件中。

我现在有一个树枝文件，看起来像这样：

<div class="form-group">
<textarea id="ormindo_newsletterbundle_newslettermessage_contents" name="ormindo_newsletterbundle_newslettermessage[contents]" class="form-control"></textarea>
</div>
<script type="text/javascript">
$(document).ready(function() {
    TinyMCEStart('#ormindo_newsletterbundle_newslettermessage_contents', 'extreme');
});
</script>

这仍然没有用。 但是，删除<div class="form-group"></div>标记可以使其正常工作。 我一直在尝试几种方法，尝试使用不同的TinyMCE版本，寻找编码错误，但无济于事。

考虑到自己是一名Web开发新手，我担心这是需要外部观点的错误。 任何帮助将不胜感激。

Answer 1

您如何生成symfony 2表单？ 据我所知，生成tinymce很简单，您只需为要转换为微小mce的表单输入设置一个id / class，然后设置javascript以查找该id / class，然后转换它。

要为symfony中的表单字段提供特殊的ID，请执行以下操作：

{{form_widget(form.text,{'id':'wysiwig_full'})}}

这将渲染一个名为id为wysiwig_full的文本字段。 用您的字段名称替换文本。

Answer 2

我绝对找不到问题的根源。 厌倦了，我切换到了CKeditor，它开箱即用地工作了，我只需要更改编辑器路径var，因为我有一个包含所有插件的文件夹。