search

spohlenz / tinymce-rails

Integration of TinyMCE with the Rails asset pipeline
Other
812 stars 256 forks source link

Issue with Turbolinks #188

Closed threebyeight closed 7 years ago

threebyeight commented 8 years ago

Doesn't matter if I'm using the jQuery version or regular version of TinyMCE, there seems to be an issue with it and Turbolinks where it will render properly once but if you navigate away from that page and then go back, the editor won't load unless you hit refresh.

Removing //= require turbolinks from application.js solved the problem for me.

HatsuMora commented 8 years ago

I have an similar issue but i can't solve removing turbolinks. And some times if I reload doesn't work too

AlexShmatko commented 8 years ago

Me too having this issue

HatsuMora commented 8 years ago

I solve it with data: { no_turbolink: true } or similar in all edit links this allow use turbolinks for all others link and disable for editing.

Try if not works I'll can post my current code with my solution

Nickk4 commented 8 years ago

I have the same issue. Tinymce loads, I navigate away, click the back button, and then there's a tinymce frame with an empty textfield (while it should have text in it) and that textfield is also not clickable / not possible to enter text in the textfield. After reloading the page, tinymce again loads correctly.

I added data: { no_turbolink: true } there where I link to the page that uses tinymce, however the problem persisted (to make sure I also restarted the server).

HatsuMora commented 8 years ago

I unzip my code and browse looking for something that I could forget and I found that, as you say, no_turbolink: true doesn't work very well.

Try remove no_turbolink and add the followings lines of Javascript in application.js for testing or where it supposed to be.

document.addEventListener('page:change', function() {
  componentHandler.upgradeDom();
});

I apologize for the previous bad response, I used tinymce a few months ago and doesn't have the source of my solution for this issue.

Nickk4 commented 8 years ago

Thanks, I added that piece of script to application.html.erb but unfortunately that made no difference.

HatsuMora commented 8 years ago

Why in the application.html.erb? I think it's better in the application.js because we need upgrade Dom in the edit action (or where you have tinymce)

If is an open source in git let me see your code.

Greetings

Nickk4 commented 8 years ago

I added to application.js:

document.addEventListener('page:change', function() {
  componentHandler.upgradeDom();
});

This made no difference. The code editor I'm using also said:

componentHandler is not defined; please fix or add /*global componentHandler*/

Therefore, I tried:

document.addEventListener('page:change', function() {
  /*global componentHandler*/
  componentHandler.upgradeDom();
});

The comment in the code editor was then gone. But still the problem with tinymce persists.

scanis commented 8 years ago

Not the cleanest solution but I used code from here to turn turbolinks off on pages with TinyMCE:

Application.html.erb

<body <%= yield(:body_attributes) %>>

View.html.erb

<%= content_for(:body_attributes) do %>data-no-turbolink<% end %>

If someone has a real solution please let me know!

spohlenz commented 7 years ago

Turbolinks compatibility should be greatly improved in the 4.5.3 release.