ajax表单上的tinymce空白内容提交？

Posted 2023-05-09

【中文标题】ajax表单上的tinymce空白内容提交？

【英文标题】：tinymce blank content on ajax form submit?

【发布时间】：2011-06-13 10:47:32

【问题描述】：

我的表单使用 TinyMCE 来格式化 html，但不知何故，第一次提交时内容总是空白。这就是我的提交功能：

$('#commentForm').click('submit', function () 
        tinyMCE.triggerSave(true, true);
        $(this).ajaxSubmit(
            success: function (result) 
                if (result.success) 
                    $('#commentForm')[0].reset();
                    var newComment =  comment: result.comment ;
                    // Append the new comment to the div
                    $('#commentTemplate').tmpl(result.comment).appendTo('#commentsTemplate');
                
                $('#commentFormStatus').text(result.message);
            
        );
        return false;
    );

我添加了tinyMCE.triggerSave(true,true);，但它似乎不起作用。有什么建议吗？

谢谢。

【问题讨论】：

你在这里提交什么？

只是文本，其中可能包含 HTML。谢谢。

【参考方案1】：

尝试替换

tinyMCE.triggerSave(true, true);

通过

tinyMCE.get("id").save();

其中“id”是您的文本区域的 ID。

【讨论】：

我也有一些 triggerSave() 的变体，很高兴你发布了这个。

【参考方案2】：

重要提示：如果您在同一文本区域上调用 tinymce() 两次或更多次，则任何 save() 方法都可能无法正常工作。 （我在每次 DOM 更改时调用函数）

所以，我通过删除类来解决这个问题：

$('textarea.tinymce').each(function()
    $(this).removeClass('tinymce');
    .......

【讨论】：

我的问题确实是tinymce被多次调用

【参考方案3】：

我不知道它是如何工作的。

我遇到了 Firefox 的问题，我使用这个 workarroud 解决了

在提交按钮上：我的文本字段名为“Contenido”

tinyMCE.get("Contenido").setContent(tinyMCE.activeEditor.getContent());
document.getElementById("Contenido").value=tinyMCE.activeEditor.getContent();

【参考方案4】：

如果您的 TINYMCE 很少：在提交调用之前

jQuery(tinymce.get()).each(function(i, el)
        document.getElementById(el.editorId).value = el.getContent();
    );

【参考方案5】：

$('form').on('submit', function(form)
    // save TinyMCE instances before serialize
    tinyMCE.triggerSave();

    var data = $(this).serialize();
    $.ajax(
        type:       'POST',
        cache:      false,
        url:        'inc/process.php',
        data:       data,
        success:    function()
                        console.log("Updates have successfully been ajaxed");
        
    );
    return false;
);

【参考方案6】：

从版本 4.2.5（可能更早）开始，您似乎不需要做任何事情。它只是在您编辑时保存值（可能是模糊）。

我注意到的一件事是，不小心将 TinyMCE 多次应用于同一个元素会停止正常的保存行为。这让我在 all 其他解决方案上都失败了，直到我注意到@Ксана Лысак 的解决方案在同一元素上运行了两次each。

在确保 TinyMCE 只能应用于每个textarea 一次之后，它在没有帮助的情况下工作得很好。

【参考方案7】：

很好的解决方案。 Ксана Лысак

但对我来说它需要稍作修改，可能是由于版本 4.1，我不得不使用 el.id 而不是 el.editorId

$("#thesubmit").click(function(e)
    $(tinymce.get()).each(function(i, el)
        if(el.id)
            document.getElementById(el.id).value = el.getContent();

);