Medium-editor: Textarea is not correctly updated

[ctrlmaniac]

Description

Textarea is not correctly update.

Steps to reproduce

<fieldset>
    <legend>Text</legend>

    <textarea name="test" class="editable"><?= $class->text; ?></textarea>

    <input type="submit" name="salva_testo" value="save" class="success" style="float:right"
</fieldset><!--text-->

var editor = new MediumEditor( ".editable", {
    toolbar: {
        buttons: [
            "bold",
            "italic",
            "underline",
            "subscript",
            "superscript",
            "justifyLeft",
            "justifyCenter",
            "justifyRight",
            "justifyFull",
            "removeFormat"
        ]
    },
    placeholder: {
        text: "Write here"
    }
} );

Everything works fine except for that medium-editor doesn't update the textarea

Here is what firebug shows:

<div class="editable medium-editor-element" id="medium-editor-1488482792718" name="testo" medium-editor-textarea-id="medium-editor-1488482792718" spellcheck="true" data-medium-editor-element="true" role="textbox" aria-multiline="true" data-medium-editor-editor-index="1" medium-editor-index="60259499-2e74-e330-1172-eb45c4579a1e" data-placeholder="Write here" data-medium-focused="true" contenteditable="true"><p align="center"><b>Text to try</b><br></p><p align="center">another text to try<br></p><p><i>more text to try</i></p></div>

<textarea name="text" class="editable medium-editor-hidden" medium-editor-textarea-id="medium-editor-1488482792718" style="height: 103.6px;">&lt;p align="center"&gt;&lt;b&gt;Text to try&lt;/b&gt;&lt;br&gt;&lt;/p&gt;&lt;p align="center"&gt;another text to t</textarea>

Versions

• medium-editor: 5.22.2
• browser: 51.0.1
• OS: Windows 10

[rusuandreirobert]

I had an similar issue, and just improvised from the example docs, if you're not using jQuery just adapt the code.

    editor.subscribe('editableInput', function(event, editable) {
      var textarea = jQuery(editable).next();

      textarea.val( jQuery(editable).html() ).trigger( "change" );
    });

[ctrlmaniac]

Thank you! I do have jquery and I opted for using a div and a hidden textarea which is updated via jquery. But a built-in feature is much appreciated!

[rusuandreirobert]

I'm using just a textarea, and added that code and it works perfectly by itself, I don't know why this small trick is needed, but I don't mind, I didn't expect this to work with the same instance on +100 textarea, anyway, glad you figured it out.

[ctrlmaniac]

Still annoying.

[aiac]

$('form').on('blur keyup cut paste', 'textarea, [contenteditable]', function(){ $("form .medium-editor-element").each(function() { content = $(this).html(); $(this).next().text(content); $(this).next().change(); }); });

This is how i manage to update textareas. I think MediumEditor updates textareas values on form submit event, but im not sure.

[jimmyadaro]

Still no solution for this?

EDIT: I've done this with jQuery:

$(".medium-editor-element").attr("data-placeholder","");

This way the placeholder does not show up.

This didn't worked for me:

var editor = new MediumEditor('.editable', {
    toolbar: {
        placeholder: {
            text: ""
        }
    }
});