No changes submitted in dynamically load tinymce

1
votes

I have a div with a text and when I click on it, I load a tinymce editor. My Problem is, that when I change the text in the editor and submit it, the changes are gone.

I have a workaround witha script, that listens on editors keyups and copys the editor content to a hidden field, but this couldn´t be the best way. Especially I also have to listen to "paste", "changes in tiny-dialogs", etc...

Here ist my code

<script type="text/javascript">

$(document).ready(function() {

    $(".TinyLoadOnClick").click(function() {
        $("#TinyArea").show();
        $(this).hide();

        tinymce.init({
            selector: "textarea",
            plugins: ["advlist autolink lists link image charmap print preview anchor","searchreplace visualblocks code fullscreen","insertdatetime media table contextmenu paste"],
            toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
        });
    });
});
</script>

<form method="post" action="dump.php">

<div class="TinyLoadOnClick">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt 
</div>

<textarea id="TinyArea" style="display:none;" name="content">
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt 
</textarea>

Here is the code in a tiny fiddle http://fiddle.tinymce.com/2ofaab/1

Can you help me?

3
jquerytinymce

3 Answers

1
votes

Use the method getContent on your editor before submit, copy the editor content to your hidden field.

var content = editor.getContent();

Or post it with AJAX described at http://archive.tinymce.com/wiki.php/TinyMCE3x:How-to_load/save_with_Ajax_in_TinyMCE

0
votes

I solved it with the mentioned workaround with a hidden field. I put this code to my tinyMCE.init and it worked. @Pontus Ivarsson thanks for the tip.

setup: function(editor) {
    editor.on("change", function () {
        setTimeout(function () {
            $("#"+TextAreaID+"_hidden").val(editor.getContent());
        }, 100);
    });
},

The answer of @Thariama seemed logical for me, but didn´t work

0
votes

Before sending the content to the backend server call

tinymce.get('content').save();

and everything is ok (the textarea content gets updatd with the editor content)