I spent a good chunk of yesterday trying to figure out how to change the state of the TinyMCE textbox from readonly to edit mode. Or to set the values to enable and disable the box properly. After much trial, error, and research I found this post which links to this post that explains that it is just not possible to do it cleanly. These posts are a few years old but in the rest of my research I couldn’t find anything that contradicted them. I tried many different workarounds suggested by other people and each one had something that just didn’t work quite right. Here is the brute force solution that I came up with:
I created two TinyMCE editors one that is readonly and one that is not. Then I show and hide them via a button click.
Another problem that I came across is properly showing and hiding the editors. When I tried to use the built in options they would not show properly when toggling. I had problems with the textareas being set to visible. To solve this problem I wrapped the original textarea inside a div and I show and hide the divs instead of the actual text area.
I like so many things about the TinyMCE editor but these problems were very frustrating and took up far too much of my time.