I am using the plugin on a project and I kept having problems loading the editor on for the second time. The problems materialized in two different ways.
- On first page view the editor worked as intended, on second page viewed the editor did not show at all
- After trying to fix #1, on first page view the editor worked as intended, on second page viewed the editor showed up but all text disappeared and I was unable to type any new text
So I narrowed down the problem to two issues
- Because of turbolinks the first textarea is still loaded in tinymce. To fix this I found a topic (sorry but forgot the source) that suggested deleting the editor when a new request was received. They suggested doing this on the app/assets/javascripts/application.js
$(document).on('page:receive',function(){ tinymce.remove(); });
And happily this made the editor appear on every request!
- After fix #1, reloading the editor failed on second requests causing the text to disappear! What I think is happening is execution of the
<%= tinymce %>
script was happening beforetynimce.remove()
. The fix to this problem was to simply remove all instances of<%= tinymce %>
and adding the following code to the app/assets/javascripts/application.js$(document).ready(function(){ tinyMCE.init({ selector: "textarea.tinymce" }); });
So to summarize, we need to use both pieces of code in tandem to get the desired behavior. So our app/assets/javascripts/application.js will have the next code added to it:
$(document).ready(function(){ tinymce.remove(); tinyMCE.init({ selector: "textarea.tinymce" }); });
Leave a Reply