I am using jquerymobile.com for my mobile application development. For all the text(type="text") elements its shows Alphabet keypad in Mobile and For (type="number"), it shows number keypad by default and also it shows Go button on bottom right corner of keypad. How can i show the Next button instead of Go for all the input elements except the last element of the page?
I know for iOS the [Previous][Next] buttons are at the top of the keyboard layout. If there is no input to navigate to it's grayed out
http://jsfiddle.net/xTtmQ/
http://jsfiddle.net/xTtmQ/embedded/result/ (view on iOS device)
http://jsfiddle.net/xTtmQ/1/
http://jsfiddle.net/xTtmQ/1/embedded/result/ (TabIndex: view on iOS device)
You might be able to play with the TabIndex as well.
At this time I'm unaware of any custom keyboard options/layouts for HTML5 webapps
Related
I've written a custom iOS keyboard that works fine. On iPads, when I switch between keyboards, my custom keyboard renders and then the shortcut bar gets added to the top (if the shortcuts bar option is turned on in settings - if it's not turned on, I have no issue). Because it's happening in 2 steps the keyboad appears to "bounce". My keyboard takes up less screen real-estate than the default iOS keybard, so it drops down. Then it pops back up as it renders the shortcuts bar.
Is there a way to either override the global setting and force the shortcuts bar off/hidden for my keyboard? Alternative, can I force it on and make it render at the same time as my keyboard is drawn?
I have a cordova iOS app. When VoiceOver is active, I have few issues like cursor is not pointing to the top left while navigating between screens(it is pointing to the middle of the screen when navigated to next screen). Also I have few disabled elements, even it speaks disabled elements. How to avoid speaking of disabled elements when VoiceOver is active?
Also is there any way I can add instructions for particular element(like scroll to visit more options)?
I have a form in a Bootstrap 3.3.2 modal.
I encounter an issue when viewing it on iOS 8 & Safari only.
This issue does not occur in Chrome or iOS 7 & Safari.
View my js bin here, http://jsbin.com/fokucu/4
After clicking "List Me", then try selecting a drop down or enter text to bring up the keyboard. After it appears, the background will scroll and you cannot scroll down the modal.
It should be noted that if the length of the table has an impact if you can scroll the modal or not without the background scrolling. Essentially more than 10 rows and you cannot scroll the modal after interacting with the form.
I cannot figure out how to solve the problem, plus I thought this was fixed in current version of Bootstrap.
Appreciate the help!
Say you've got a Xcode app with embedded web view exposing a simple HTML5 page.
This page has a title and an input tag and a nav top bar (position: fixed; top:0;).
When the user tap in it the first time, the whole screen scrolls up to enable the keyboard appears while maintaining the input tag visible, when I tap the enter button.
The issue I face is that my HTML is not restored identically (I mean, it scrolls down back, but my top bar is shifted about 10 pixels below the top edge of the screen.
But when I tap the keyboard hide button, the scrolls restore my initial view, with no issue.
Anyone experienced the issue before? Any clue of what going on or a way to work around this?
Ps: issue is present on iOS 7 (7.1.2). I didn't tested on iOS 8 as my app must support iOS 7.
I finally ended up with adding an explicit keyboard withdrawing by applying blur() the the input as follows:
<input ng-change="$(this).blur()">
This immediately makes the keyboard disappearing, while the hw initial scrolling is reversed.
I know I've seen the date picker for iOS with "Previous", "Next" and "Done" buttons before, but for some reason all I'm seeing is the "Clear" button on a standard date input in Mobile Safari. Just wondering if there is a way to enable these other buttons somehow.
According to my testing the Next, Prev and Done buttons appear only on iPhone devices, on iPad there's only Clear button for <input type="date"></input> control.