Menu
I am trying to create a text input with emojis in an Ionic app, using a contenteditable div. It works fine in the browser when I serve the app, but the div is not editable when I run the app in the iOS simulator or on an iPhone. The div is visible and if I click it, the keyboard appears, but no cursor. If I type, nothing happens in the div.
<div contenteditable="true">Some text</div>I suspect this has something to do with the WKWebView, but not sure why this works in Safari, but not in the app. Is there something that needs to be enabled to get it to work?
349
All you have to do is set the contenteditable attribute on nearly any HTML element to make it editable. Here's a simple example which creates a <div> element whose contents the user can edit.
After users have made some edits, they can click on the 'Save Changes' button and the changes made can be saved permanently. If the title is editable, we set the contentEditable property on each of the editable elements to false.
Just set contentEditable="false" . See this answer.
Angular does not have an accessor for contenteditable , so if you want to use it with forms you will have to write one.
So the problem was with webkit. I needed to change the user-select option to auto in the CSS for the editable div:
-webkit-user-select: auto;
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With