Hi in a wizard on a confirmation tab i try to get the content from the tinymce editor. But it doesn't work. With normal textareas it works without any problems.
Example normal Textarea:
<div class="control-group">
<label class="control-label">MyValue<span class="required">*</span></label>
<div class="controls">
<textarea class="span12 m-wrap" style="max-width:100%;" name="MyValue" rows="7"></textarea>
</div></div>
Code to show text from textarea on the confirmation page:
<div class="control-group">
<label class="control-label">MyValue</label>
<div class="controls">
<span class="text display-value" data-display="MyValue"></span>
</div>
</div>
My JavaScript code:
var displayConfirm = function() {
$('.display-value', form).each(function(){
var input = $('[name="'+$(this).attr("data-display")+'"]', form);
if (input.is(":text") || input.is("textarea")) {
$(this).html(input.val());
} else if (input.is("select")) {
$(this).html(input.find('option:selected').text());
} else if (input.is(":radio") && input.is(":checked")) {
$(this).html(input.attr("data-title"));
} else if ($(this).attr("data-display") == 'htmlinhalt') {
$(this).html($('[name="htmlinhalt"]', form).val());
}
});
}
But why it doesn't work with a tinymce textarea? I think I must get the content directly from tinymce not from textarea, but how?
Try
tinymce.get('your_textarea_id').getContent();
I had exactly the same problem and the previous answer wouldn't work for me either. The problem for me was that my textarea had no id. After giving it an id I was able to get the content easily with the previous answer (albeit with capital 'MCE'):
tinyMCE.get('your_textarea_id').getContent();
So you want to add an extra line into your if statement. If you give the textarea the same id as its name then this should work:
var displayConfirm = function() {
$('.display-value', form).each(function(){
var input = $('[name="'+$(this).attr("data-display")+'"]', form);
if (input.is(":text")) {
$(this).html(input.val());
} else if (input.is("textarea")) {
$(this).html(tinyMCE.get($(this).attr("data-display")).getContent());
} else if (input.is("select")) {
$(this).html(input.find('option:selected').text());
} else if (input.is(":radio") && input.is(":checked")) {
$(this).html(input.attr("data-title"));
} else if ($(this).attr("data-display") == 'htmlinhalt') {
$(this).html($('[name="htmlinhalt"]', form).val());
}
});
}
You can get the raw contents (with html tags), or only the text (html striped). The default format returned with function getContent() is the raw.
<textarea id="MyValue" name="MyValue"></textarea>
<div>
<a href="javascript:alert(tinymce.EditorManager.get('MyValue').getContent({format : 'raw'}));">[getRawContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('MyValue').getContent({format : 'text'}));">[getTextContents]</a>
<a href="javascript:alert(tinymce.EditorManager.get('MyValue').getContent());">[getContents]</a>
</div>
I use MyValue since you use in the your question. Change for your_textarea_id if needed.
More information for tinyMCE 3.x in API 3 More information for tinyMCE 4.x in API 4