Keyboard not always shown when focusing HTML input/contenteditable elements on AnkiMobile

AnkiMobile (iPhone/iPad)
1

I have to design a card template with an HTML input box for custom answer comparison for a user. One issue we’re facing is that focusing basic input/contenteditable elements in AnkiMobile is not showing the keyboard properly.

Here is a demo that shows the issue, recorded by the user:

The sample deck shown in the video:

For what it’s worth, AnkiDroid also has a similar issue. I only managed to make the keyboard show up there in the Android Studio’s emulator by pressing tab to activate the input box (Tapping doesn’t work). I also tested with a basic webview app and it works as expected.

1 Like
2

Does tappable help?

https://docs.ankimobile.net/more.html#javascript

1 Like
3

Hi @dae, following up here as requested. Tappable does fix the issue the OP mentioned on this thread for me at least i.e. clicking on text field properly changes focus when not using external keyboard, but my issue was slightly different because I am using external keyboard which with or without tappable class will focus correctly when using the trackpad. My issue was that I cannot insert the space or e, or d character while typing because that will trigger the hot key. This only applied to external keyboard. On screen keyboard doesn’t trigger hot key.

4

That did the trick - Thanks!
Maybe the fix can be applied automatically to input elements by AnkiMobile like it’s doing for a/button elements?

1 Like
5

@abdo I’ll look into it.

@O3nnM7LP5GzFMBS thanks, looks like I incorrectly identified them as the same issue. Will follow up on your original post.

6

I also have another possibly related issue with autofocus/.focus() not bringing up the keyboard automatically. Searching on the web, I found this: 195884 – Autofocus on text input does not show keyboard

So this looks like a general issue, and Apple doesn’t like this behavior :frowning: I’m interested in knowing how AnkiMobile makes autofocus work for the {{type:}} filter (If it’s implemented in HTML).

7

To allow user input on AnkiDroid you need to enable “Type answer into card” in the advanced settings tab.

1 Like
8

Thanks - It’s working on AnkiDroid now!

As this option is obviously intended for another purpose, and it’s working for my case only as a side effect, I wonder whether inputs can be made focusable by default without having to enable this option. I’ve actually submitted a bug report for the keyboard issue. Will update it with this suggestion.

1 Like
9

The typing box is outside of the webview to avoid this issue.