TinyMCE 多个编辑器在 Yii2 中无法正确呈现 [英] TinyMCE multiple editors not rendering correctly in Yii2

问题描述

我正在使用 Yii2 和来自 2amigos/yii2-tinymce-widget 的小部件.

I'm using Yii2 and the widget from 2amigos/yii2-tinymce-widget.

编辑器仅在我只使用一次时看起来正确，但是当我使用多个编辑器时，第二个、第三个等编辑器无法正确呈现.在第一个之后我是否必须停止 TinyMCE 的初始化?

The editor only looks correct when I'm using it just once, but when I'm using multiple editors the second, third, etc. editors are not rendering correctly. Do I have to stop the initialization of the TinyMCE after the first one?

以下是未完成渲染的示例:

Here is an example of the missed rendering:

这是我使用小部件的代码:

And here is the code where I'm using the widget:

<?php

$form = ActiveForm::begin([
            'id' => $ansichtAktiv->id,
            'enableClientValidation' => true,
            'action' => 'index.php?r=empf/ansichtspeichern&geraet_token=' . $geraet->token . '&ansicht_id=' . $ansichtAktiv->id
        ]);
?>
<?=

$form->field($ansichtAktiv, 'html')->label('Ansicht:')->widget(TinyMce::className(), [
    'language' => 'de',
    'clientOptions' => [
        'plugins' => [
            "advlist autolink lists link charmap print preview anchor",
            "searchreplace visualblocks code fullscreen",
            "insertdatetime media table contextmenu paste",
            "textcolor",
        ],
        'toolbar' => "forecolor backcolor | undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
    ]
]);
?>
<?=

$form->field($ansichtAktivSec, 'html')->label('Ansicht2:')->widget(TinyMce::className(), [
    'language' => 'de',
    'clientOptions' => [
        'plugins' => [
            "advlist autolink lists link charmap print preview anchor",
            "searchreplace visualblocks code fullscreen",
            "insertdatetime media table contextmenu paste",
            "textcolor",
        ],
        'toolbar' => "forecolor backcolor | undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
    ]
]);
?>
<?= Html::submitButton('Speichern', ['class' => 'btn btn-danger', 'name' => 'speichern-button']) ?>
<?php ActiveForm::end(); ?>

推荐答案

注册一个新的JavaScript文件并添加这部分代码:

Register a new JavaScript file and add this part of code:

$(document).ready(function() {
    tinyMCE.init({
        mode: "textareas",
    });
});

一旦文档被加载，tinyMCE 将初始化所有类型为 textarea(默认)的 TinyMCE 插件.

Once the document is loaded, tinyMCE will initialize all TinyMCE plugins that have a type of textarea (default).

如果你更喜欢在视图文件中编写，那么在它的底部添加:

If you prefer writing inside view file, then add this at the bottom of it:

$this->registerJs('
    tinyMCE.init({
        mode: "textareas",
    });
', View::POS_END);

这篇关于TinyMCE 多个编辑器在 Yii2 中无法正确呈现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！