Ephraim
Ephraim

Reputation: 255

Inconsistent behaviour in CKEditor using Jquery mobile in Safari on iOS5.1

http://demo.goseamless.co.za/cktest/ - this link contains an example of code with the bug

try typing in the editor on an iOS device, then move the cursor around by tapping in a different place in the editor. and carry on typing, the editor stops responding, then closing the keyboard and tapping again to edit allows you to type.

Also the Next/Previous buttons on the iOS on screen key board ignore the editor when "tabbing" through controls

Upvotes: 1

Views: 1164

Answers (1)

Alexander Poleschuk
Alexander Poleschuk

Reputation: 1049

As you may know, the CKEditor (as many other HTML editors) is implemented on top of an iframe. When you tap within the editor to move the cursor, for some reason the page containing the editor gets focus while the editor's iframe loses it. That's why the editor stops responding. It's JqueryMobile that causes this strange focus transition.

I tried out different workarounds, for example I tried to bring the editor back in focus when the editor lost it or tried to prevent JqueryMobile from moving the focus from the editor to the page. But these workarounds solve the problem only partially or don't solve it all.

I ended up with upgrading to CKEditor 4. (It is still in beta as of this writing.) CKEditor 4 is still based on an iframe. So it has the same focus-related problems as its previous version. But CKEditor 4 also supports inline editing. This implementation is based on a contenteditable element rather than an iframe. It's free from the focus problems. We customized the inline implementation to our needs and use it on our site. So far it is all right.

Upvotes: 1

Related Questions