[solved] IE can't insert links in TinyMCE

[Soma]

Again, IE problem. So far all IE.

I just got a session with a client on phone where he wasn't able to set a link on a text in TinyMCE. She's using IE.

The problem seems the text selection gets lost when clicking link button, so when I close PW link dialog the text I selected before isn't selected anymore. So when setting a link it gets inserted in the HTML but at the beginning and not visible cause there's no a text.

I appreciate any help finding out what's up with this and how to fix it.  This is pretty confusion since the client don't know what's going on, and I'm pretty helpless here now. They can't use another Browser, so this is no option.

[formmailer]

What version of IE is the client running?

[Soma]

It doesn't matter, it's a problem in all , IE8,IE9 ...

---

If you select text, click on link insert... close dialog ... text selection is gone.

[apeisa]

I can confirm the issue and repeat it (using pretty recent version of P21 and IE9). After clicking insert link there is no link.

[Soma]

Thanks Apeisa for the confirm..

Yes I'm currently trying. It seems the selection get's lost when modal window gets openend. It works with other dialogs, like image or other TinyMCE commands. I can select text and it's still selected afterwards...

I'm trying to figure out why the selection gets lost. But no luck. :/

[apeisa]

Yes, selection gets lost right after clicking link icon and when modal comes. Interesting that it keeps selection if you click img-icon for example.

[Soma]

Yeah exactly... it's driving me nuts

[formmailer]

Not that it helps much, but isn't this the same problem as the one described in this topic:

http://processwire.com/talk/index.php?topic=230.0 ?

[formmailer]

I haven't had time to check if it works, but a possible workaround would be to disable the "Inline popups" plugin for TinyMCE.

[apeisa]

Not that it helps much, but isn't this the same problem as the one described in this topic:

http://processwire.com/talk/index.php?topic=230.0 ?

Exactly same problem.

[formmailer]

I haven't had time to check if it works, but a possible workaround would be to disable the "Inline popups" plugin for TinyMCE.

I have tested now, but it doesn't solve the problem. 

[Soma]

Thanks for testing! Shame it doesn't work.

I tried to compare the image PW Tiny Plugin, cause there it "works", the selections stays. But no luck so far. :/

Is this related to the issue? http://www.tinymce.com/forum/viewtopic.php?id=17374

[ryan]

This is the same issue I ran into with IE8 awhile back. I never could figure out why it lost the selection. I'm sure there's an answer but put a lot of time towards it and never was able to solve it. TinyMCE is a pretty complex piece of software, and IE is an interesting browser. There's never a dull moment when those two get together. I would really like to find a solution here. Hopefully between all of us, we'll be able to find a solution.

[formmailer]

The current demo version on the TinyMCE site doesn't seem to have this issue, but it might be interesting to see if the example page of TinyMCE that comes with the version PW is using has the same problem. If that's the case it would rule out a PW problem (other than not using the latest version).

I checked if I could download the package from the TinyMCE site, but I couldn't find it. The files included in PW seem to use another folder structure, so that example page isn't working.

Ryan, do you still have the original package somewhere?

/Jasper

[Soma]

I found a solution using getBookmark() and setBookmark() to restore selection.

I don't know if it works in all cases, but now we got something.

I mainly do

// global before (function...
var editorCursorPosition;

//before modal dialog is openend. that's where IE still has selection.
editorCursorPosition = ed.selection.getBookmark(false);

// in the dialog jquery function
// to restore selection.. and the link will be set on text selected...
ed.selection.moveToBookmark(editorCursorPosition);

I attached plugin. I would appreciate if you could test if it works for your guys..

pwlink.zip

[ryan]

Ryan, do you still have the original package somewhere?

The full TinyMCE installation should be in /wire/modules/Inputfield/InputfieldTinyMCE/tinymce-3.3.9.2/

To change the TinyMCE version, add another tinymce-1.2.3.4 directory there like the other (replacing 1.2.3.4 with the version), then update the version number at the top of InputfieldTinyMCE.module, where it says this:

const TinyMCEVersion = '3.3.9.2';

All of our custom plugins are in the /plugins/ dir, outside of the tinymce dir, so it should be possible to upgrade the version without worrying about updating anything in the tinymce source. That's assuming that our plugins are compatible with newer versions.

The current demo version on the TinyMCE site doesn't seem to have this issue, but it might be interesting to see if the example page of TinyMCE that comes with the version PW is using has the same problem.

I don't think the problem is with TinyMCE itself. I actually think the problem is the use of jQuery UI dialogs, but not 100% sure. I just know that the TinyMCE dialogs work in IE8 (as you saw on their demo). Unfortunately, I never could get the TinyMCE dialogs working with our image and link plugins. I think this has more to do with my lack of knowledge on the inner workings of TinyMCE than it does with anything else. WordPress has this all working pretty nicely with TinyMCE dialogs, but I couldn't duplicate the results (this was awhile ago). Though I still have a preference for jQuery UI dialogs, but I think we can sacrifice to support IE if it turns out we can solve it with that.

[Soma]

Ryan see my previous post... I think we got an easy solution. But would be cool if you check if there would be any problems with the rest of the plugin code. I can't make my mind around what it does with the checks for if parent node selection is "A" etc. But so far it works fine, setting/removing links and edit them in IE.

[ryan]

I'd experimented with getBookmark() and setBookmark() back when I was originally trying to get this working in IE. If I recall, it did solve the problem in IE but then caused major problems in others, so I didn't pursue that further. But your code may be accounting for something mine didn't–I'm anxious to try it. Unfortunately I'm stuck on a rush project for a client today, and can't do much other than take 5 min breaks to check in on email and the forum. But hope to try here soon. Thanks for working on this.

[Soma]

So far I don't experience any problems with other Browsers, still works fine. FF, Chrome, Safari ... not sure on older versions of them.

I'd appreciate any help testing this a little more. Thanks guys for the help.

[formmailer]

So far I don't experience any problems with other Browsers, still works fine. FF, Chrome, Safari ... not sure on older versions of them.

I'd appreciate any help testing this a little more. Thanks guys for the help.

I did some quick tests with a view browsers and I didn't experience any problems with them.

I tested: Internet Explorer 8, Firefox 8.0.1 and Chrome 15.0.874.121 m.

At this moment I don't have more browsers on my system to test with.

/Jasper

[Soma]

Thanks a lot formmailer! Great to hear.  8)

[ryan]

Soma, thanks for this fix for this and for the IE8 file delete link fix. I tested both here and both worked well so I committed them. Thanks again!

[Soma]

Thanks Ryan for including them, glad I could help and fix them finally.

Whohooo my code is in the core! Feels a little proud.