wysihtml5
wysihtml5 copied to clipboard
Unable to blur editor on iOS
I want to stop editing when the user touches outside of a wysitml5 editor on an iPad etc. On the Desktop clicking outside of the iframe does a blur and editing stops, however this doesn't work on iPads. I've added:
$(document).on( 'touchstart', function( event ) {
editor.currentView.element.blur();
// also tried
editor.composer.iframe.blur();
editor.currentView.doc.activeElement.blur();
etc...
});
Where document is the document containing the editor. None of my many attempts trigger an actual blur event in the editor.
editor.fire( 'blur' );
fires a blur, however the textarea doesn't see a blur event and still has focus.
The only way the user can stop editing is by closing the iPad virtual keyboard, which triggers the usual blur event.
-Neville
I am having the same problem here.
There is no way to trigger the focus to go away from the editable region. I have tried many different techniques and many hours trying to figure this one out.
On my page when the user hits the save button, which should trigger blur the page saves and moves on to the next page with the keyboard still open and the caret floating on the page where it thinks the iframe was.
I started to debug your source but didn't get completely through yet.
Some things I tried:
.find('iframe').contents()[0].activeElement.blur();
.find('iframe').contents().parent().focus();
$('#inputId').focus().blur();
document.activeElement.blur();
$('iframe').blur();
Also tried simulating a tap or click on another element on the page and it still doesn't like that. Only way to close, like said above, is to manually hit the keyboard.
Coming from CKEditor, this was working there and that also uses iframe
+1
FYI - I found that this was a good workaround: http://stackoverflow.com/a/8949885/1138751
Basically, create a pseudo-invisible input (can't be display:none
or visibility:hidden
, but can be size: 0; opacity: 0
). To blur the editor and close the keyboard, just focus() then blur() on the input.
@jerryorr Thanks for that - I'll try it when time permits.
+1
Im going to do the workaround but it would be nice to have this feature implemented on the plugin
The workaround didnt work for me.. What Im doing is: - Click on the wysihtml textarea element - Click outside
The keyboard keeps appearing and I am unable to continue writing.
I have the same problem. Any solution?