Home Forums Backend Issues (wp-admin) Update a tinymce textarea via javascript


Update a tinymce textarea via javascript

  • I have a need to fill out various ACF fields via Javascript, when a user is editing a particular type of post.

    It’s been easy to accomplish – with the exception of TinyMCE / wysiwyg textareas.

    I’ve tried various things such as:

    tinymce.get("acf-editor-id-here").setContent("Hey man")


    I am able to update the value like :

    But I don’t actually see the tinymce editor change, nor does it update the value when I save the post. I’m missing something!

  • @etling – did you ever resolve this issue? – i’ve been searching and unable to find a working example. All other fields update on the page apart from wysiwyg fields?


  • @paul_crookell – sort of! What seemed to work for me was to set the value using the ACF JS field API, and then use jQuery to “click” the code view tab. And then the text I was inserting would appear.
    That was good enough for this project so I didn’t dig further – whenever I tried programmatically selecting the wysiwyg view, the value would go blank again.
    My solution, in essence:
    var description = “This text should appear in the TinyMCE textarea!”;
    jQuery(“div.acf-field-5d5231b7e8738 button.switch-html”).click();
    Would love to know a more elegant way!

    Ignore all that, I sorted it – updating in one second, hold tight.

  • OK, here’s a better version. You have to find your ACF field, find the textarea within the editor, get that ID, then setContent using TinyMCE JS API:

    var description = "Some text!";
    var f = acf.getField("field_5d5231b7e8738");
    var tinyID = f.$el.find("textarea").attr("id");
    var tinyInstance = tinyMCE.editors[tinyID];

    Worked well for me, let me know how it goes.

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Update a tinymce textarea via javascript’ is closed to new replies.