tinymce blank content on ajax form submit?

My form uses TinyMCE to format HTML, but somehow the content is always blank on first submission. This is what I have for the submit function:

$('#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;
    });

I've added tinyMCE.triggerSave(true,true); but it doesn't seems to work. Any suggestion?

Thanks.

Try to replace

tinyMCE.triggerSave(true, true);

by

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

where "id" is the ID of your textarea.

Important: If you call tinymce() twice or more times on the same textarea, any save() methods will be not working probably. (I have function called at each DOM change)

So, I fixed this by removing class:

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

I dont know how it´s works.

I was taking problems with firefox, and I solved using this workarroud

on submit button: and my text field is called "Contenido"

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

If you have few TINYMCE in form: before submit call

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

$('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;
});

As of version 4.2.5 (and probably earlier) you do not appear to need to do anything. It just saves the values as you edit (probably on blur).

Once thing I did notice, is that accidentally applying TinyMCE more than once to the same element stops the normal save behavior. This had me failing with all the other solutions, until I noticed that the solution by @Ксана Лысак was running the each twice on the same element.

After ensuing that TinyMCE could only be applied to each textarea once, it worked just fine without help.

Good solution. Ксана Лысак

But for me it needed slight modification, may be due to version 4.1, I had to use el.id instead of el.editorId

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

});