TinyMCE 需要阻止发送表单答案

【问题标题】：TinyMCE required prevent from sending formTinyMCE 需要阻止发送表单
【发布时间】：2017-12-16 16:32:35
【问题描述】：

我对 TinyMCE 有疑问。在我基于 CakePHP v3 的应用程序中，我有一个表单来添加忠诚度任务。有一个字段使用tinymce来描述任务。

所以问题是当我用数据填写表单并单击提交按钮时没有任何反应。更重要的是，还有编辑任务的表格，它工作得很好（完全一样）。没有为有问题的表单添加自定义 JS。

我知道在 textarea 上带有 require 的 TinyMCE 会导致问题，因为当我禁用 required 时它可以正常工作。

一些代码：
TinyMCE 初始化：

tinymce.init({
    selector: 'textarea.tinymce',
    height: 500,
    plugins: [
        "advlist autolink link image lists charmap preview hr anchor image",
        "wordcount visualblocks visualchars fullscreen insertdatetime nonbreaking",
        "table paste"
    ],
    toolbar1: "undo redo cut copy paste | bold italic underline strikethrough subscript superscript | alignleft aligncenter alignright alignjustify | table",
    toolbar2: "formatselect | outdent indent | bullist numlist | blockquote link unlink charmap hr image | preview",
    menubar: false,
    content_css: [
        '//www.tinymce.com/css/codepen.min.css'
    ]
});

表单（删除了一些元素）：

<?= $this->Form->create(null, ['enctype'=>'multipart/form-data']); ?>
<div class="col-xs-12">
    <div class="form-group">
        <label>Tytuł</label>
        <input type="text" name="title" class="form-control" required="required"/>
    </div>
</div>
//additional elements
<div class="col-xs-12">
    <div class="form-group">
        <label>Treść zadania</label>
        <textarea name="task" class="form-control tinymce" required="required"></textarea>
    </div>
    <input type="submit" class="" value="Dodaj"/>
</div>
<?= $this->Form->end(); ?>

使用的 TinyMCE 版本：4.6.4（最新）

【问题讨论】：

当您单击提交时，您的 textarea 不包含任何内容，因此会启动浏览器验证。我认为在这种情况下，您需要为 TinyMce 编辑器窗口进行一些自定义 js 验证。 stackoverflow.com/questions/16450499/…

标签： javascript php cakephp tinymce

【解决方案1】：

感谢您的快速回复，但我自己在 tinymce 支持论坛上找到了答案。

对于遇到此问题的其他人：只需将以下代码添加到您的 tinyMCE 初始化中。

setup: function (editor) {
    editor.on('change', function (e) {
        editor.save();
    });
}

【讨论】：

这是一个很好的答案，但是当我们将该字段留空时问题仍然存在。导航器将突出显示隐藏的字段。有什么解决办法吗？
我找到了解决方案并将其添加到此线程中：stackoverflow.com/questions/60834085/…

【解决方案2】：

您的编辑表单可能与您的添加表单相同，但在编辑时您将在必填字段中有一些数据，因此required 选项不会造成任何问题。在添加表单中存在相反的情况 - 您有空字段，并且验证失败。为了解决这个问题，您可以从 tinymce 输入中删除 required="required"，并进行额外的验证 - 无论是在客户端的 js 中，还是在服务器上的 cakephp 表类中。

【讨论】：