06-12-2014 05:14 PM
My HTML / Webworks 1.0 / bbui.js app has a table where the user will add entries, and for simplicity and design consistency, I have the form fields as part of the same "structure" as the table, but hidden from view until needed. I automatically put the focus on the first form in the field when the "new item" button is clicked, but the virtual keyboard overlaps half of the form which requires the user to manually shift the form up with a swipe up with the thumb, which may dismiss the keyboard if the user gives focus to another object etc.
I've tried adding an event listener for "keyboardOpened" and in that event do a "scrollIntoView" on the bottom-most object in the form (the "Cancel" button) but that doesn't seem to work: additionally, the UI jumps around annoyingly before settling down iinto the (previously mentioned) have overlapped state.
Is there an order to the events being fired that I need to be mindful of? Or is there a method other than "scrollIntoView" that I should be using instead?