I am currently working on my toy project, implementing chat web-app.
It is almost made except keyboard issue that it is dismissed when I send a message (currently it is using form, generated by phx.gen.live).
I tried phx-hook to re-focus on input field just after the form submit(when updated) but it didn’t work in some mobile browsers, and even in success cases, keyboard got once dismissed and reactivated. It is so annoying in chatting experience.
Ideally, the keyboard and focus on input field should be conserved whether or not sending chat (form). How can I manage to do that?
Hello and welcome!
This is more a JavaScript question than a LiveView one (which is fine!). I think you can find what you’re looking for here (though I’ve never done this myself). TL;DR set virtualkeyboardpolicy="manual" on the appropriate node and use the VirtualKeyboard class’ show() and hide() methods. I’m sure in some cases, though, you’re at the mercy of the platform you’re running the browser on.
Sorry for late reply.
I changed the button’s type to “button” to prevent submit of form and added some code to handle it.
Now the keyboard works fine!
(The virtualkeyboard attr didn’t work on my iOS device…)
1 Like
