[Signature Pad] Signature Pad focus android

Forge Component
Published on 20 Feb by Labs
5 votes
Published on 20 Feb by Labs

Hi all,

I'm using the signature pad in a screen with other inputs above it. On android the focus jumps to the input right above the signature pad when the stroke finishes, thus displaying the keyboard for that input.

So not a great UX when you have to press the back button every time you sign on android.

Any ideas?



Hi Artuur,

You mention this happens on Android. Does this mean it doesn't happen in iOS?

Have you tried playing around with the inputs' tab order, to see if that affects the behavior?

I don't think the behavior could be caused by the component's code, so it's either a default behavior of the web view or something that's happening on the EndStroke event. Can you share your code?

Alternatively, if debugging is proving time consuming, you could consider forcing the focus to be on a specific element after the EndStroke, an element that doesn't pop open the keyboard.

Hope this helps,


Hi Daniel,

I did some more testing and noticed this happens because the back button on an android closes the keyboard, but it keeps the focus on the input field. So when I filled in the name in the input above the signature, pressed the back button and signed, it would give me the keyboard again and focus on the previous input on the StrokeFinished event. So not a problem with the code as you suspected.

Getting rid of the focus when the back button is used is probably a bit of overkill, but if someone knows an easy way to do this, let me know.



Hi again,

If you'd like to remove focus when the keyboard is closed I know a way which is relatively easy but not straightforward.

You need the keyboard plugin and you listen to the keyboard close event, which the plugin will give you.

On your event handler, using a JS node you find which element has focus and trigger a blur event on it. I actually did something not very different from this recently and it's simple, but let me know if you need more details.