I have an acf_form on the front-end that uses a WYSIWYG field, which as many know, uses TinyMCE.
I am familiar with TinyMCE and manipulating it’s content, however I’ve never done so in a WP environment.
When I try to fetch content using any of the default functions to get content, I get errors:
// Get the HTML contents of the currently active editor
tinyMCE.activeEditor.getContent();
// Get the raw contents of the currently active editor
tinyMCE.activeEditor.getContent({format : 'raw'});
// Get content of a specific editor:
tinyMCE.get('content id').getContent()
Errors such as: TypeError: tinyMCE.get(...) is null
Before just doing a textarea and adding in tinyMCE again manually, I’d like to know 1) if I can actually manipulate WYSIWYG content via JS or not 2) …if so…how?
Thanks!
It has been a long time since I’ve done this, but yes, I know that it’s possible, but you need to target the tinyMCE object of the specific field.
I made a modification to another plugin once that was not working with multiple editors and I added this loop to the plugin. The plugin as Sortcodes Ultimate and I added this loop so that it could find the correct editor.
for (i=0; i<tinyMCE.editors.length; i++) {
if (window.su_generator_target == tinyMCE.editors[i].id) {
$editor = tinyMCE.editors[i];
}
}
mce_selection = $editor.selection.getContent();
But that’s the only reference I can find, it was over 2 years ago that I looked at this. Bottom line is that it is possible to manipulate the content of the editor using JS, I just don’t know if you’ll find much help doing it and I don’t know if this information will help you or not.
You may also want to look at the ACF JS API https://www.advancedcustomfields.com/resources/javascript-api/ that has methods to get and set field values. The developer has done quite a bit of work on this and updating fields using the ACF method generally works, but I have not tried it with wysiwyg fields.
