Create a simple <input type="date" /> on a page.
Open your web app on an Android device with a Chrome browser (I'm using P7).
Turn on Talkback.
Open date input.
Select a date, and set.
Watch as the focus is now on the top left home button of the browser. It will say "Chrome Home Button Double-tap To Activate ...".
Anyone else experiencing this?
I wanted to just add setTimeout into onChange callback so that it just focuses back to the input itself, but it won't work if user decided to use keyboard input for the date.
Related
is there any way to set focus on the input field without showing keyboard on a device? The code is shared across the website and the mobile device. I just want to acquire situation when on a website I got "focus" on the input element as well as on device but without displaying a keyboard on the device. I tried:
document.getElementById("myInput").focus();
but doesn't work.
Why do you want to focus an input field if you don't want to write in it? Otherwise you can check with
var isMobile = Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if the user agent is mobil before you take the focus.
It's a normal behavior of device.
You can use some cordova plugin (like this cordova-plugin-keyboard) to hide the keyboard.
Don't forget to check out if the user agent is from a mobile device
Anyway, it's the behavior of device, hide the keyboard will make your application act different from the others
I have been working on this specific requirement for more than 2 months now. But I haven't found a solution yet to disable the native keyboard when an input field is focused in a webview. I am building an app which has a built in keypad(essentially a view) and I want this to be displayed instead of the native keyboard.
What I've tried so far:
Add javascript eventListener for click events to display my keypad
using JavscriptInterface.(Works)
Set the webview focusable:false and
its parent's descendantFocusability to blocksDescendants (This works
but doesn't display the cursor on the input field)
Hiding the native
keyboard on resize event of javascript using loadUrl method.(Works
but the native keyboard is displayed momentarily before hiding the
keyboard)
Listening to the OnGlobalLayoutChange event to check if
the keyboard has been added. (Works but the result is same as
in the case above with a little improve in performance)
Force stop the IME service. (Works but the app has to be a system
app to force stop packages and the keyboard service has to be started
whenever the app goes to background.
Is there a way in which I can make this work?
You should set the windowSoftInputMode to stateAlwaysHidden for the Activity containing the web view. This should keep the onscreen keyboard hidden for the entirety of that Activity.
I'm trying to get access to the mobile keyboard in a cordova app so that while the user is signing up, they can just jump to the next input on the keyboard. For example, on iOS native apps, you have access to change the "return" button to "next" or "go."
I've looked at the Ionic-plugin-keyboard but as far as I can see it doesn't allow you to do what I'm trying to do. Is there a way I can change those buttons with js/is there another plugin I can do that with?
Here are some potential resources for keyboard control:
link 1
link 2
link 3
In summary: On most devices it show a "next" button when adding the attribute tabindex to each input, incrementing in order. Otherwise it is generally suggested to set an input as the browser's default focus, or to detect when the user clicks "ok" and move the focus after that event (key code for "ok"/"enter" is 13).
I tried with focus, select, triggering click/tap events but no luck.
I see Facebook sign up page implementing this.There is a exclamation mark. It will show up if you touch any of the birthday select control without changing it and then focus elsewhere. The interesting thing happens when you tap the exclamation mark on iPad Safari. The year options will show up. (It doesn't show on desktop Chrome which I'm using to type this ask).
So the question is how to implement the same behavior for iPad?
I put the picture of the Facebook sign up page at http://imgur.com/Hh6JHPW
Some code I tried:
$('#someselect').val('test');
$('#someselect').focus();
$('#someselect').click();
$('#someselect').prop('selectedIndex',0);
$('#someselect').mousedown();
$('#someselect').prop('size',10);
You can just use a hidden <label> with some Javascript to show it if the dropdown's value is the default.
jsfiddle
I am making a mobile HTML page that has an input field. When I tap the inside of the input field, the iOS 7 keyboard appears. But the keyboard has a top ribbon that contains "<", ">", and "Done" buttons, as this
How to get rid of this top ribbon on keyboard? I want to keyboard style same as for safari address bar input and the iOS7 "Messages" app. Thanks!
its not possible due to the way iOS is designed,maybe in the future but for now we are stuck with this keyboard
As of iOS 9.3 this is not possible. (Unlike android) iOS is not open source so it's hard to prove but It's likely intentional because there is no other safe way to exit the keyboard. (Unlike android which has a back/close-keyboard button on swipe up or physically depending on the device).
The following is a list of border cases that one might expect to hide the done bar if it were possible to do so;
<span contenteditable="true"
<input tabindex="-1"
<input type="search"
only one input tag on the page
no form tag