iPad virtual keyboard - which one - javasctript solution? - javascript

It seems there are several different layouts of the iPad virtual keyboard when it appears for example a user clicks a text field on a web site... is there a way to determine which is shown?
e.g. I have a sign in page which requires a user to enter their email address, therefore, I'd like the virtual keyboard to show with the # symbol on the first page as opposed to having to select the symbols shift when a user clicks in a text field to enter their email address.
Is this possible?

I suggest you to read this article.
It's very complete about how many different keyboards you can show to your users...

Try
<input type="email" />
You can control the keyboard shown by adjusting the input type accordingly.

Html5 introduced several new input types, they can display different virtual keyboards.
Check http://www.w3schools.com/html5/att_input_type.asp

Related

Focus on input field but do not show keyboard

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

iOS jumps and targets new field when using the autofocus

I have a login page that contains the usual email and password fields, as well as a log in button. For usability, the autofocus HTML5 attribute has been used on the email field.
When loading the page on iOS, you can tell by the green border that the field has the focus, but because of iOS limitations, the focus is not fully applied to the field, as you can see here with the keyboard not being displayed:
The first thing the user does is touches the email field, but as far as iOS is concerned, you're clicking on a different part of the page. The focus is actually given to the password field instead, because the page shifts upwards to make way for the keyboard that did not display previously:
In a similar behaviour, if the user touches on the password after page load, the log in button is clicked instead and validation errors appear.
Is there any way to solve this?
Why not disable the autofocus when you show the page on iOS?
It would be very annoying when user enter a website and the keyboard pops up without any actions on the page.
I even can't think of any website popping up the keyboard on the load.

Unable to trigger keyboard on input focus through JavaScript

I'm developing an web application that contains a form with two input elements. One of the user requirements is that after inserting a character into the first input it should automatically trigger the focus of the next element and show the keyboard.
After googling about it seems that isn't possible to programatically trigger the keyboard on iOS through JavaScript. The reason however isn't quite clear to me, some say that is an UX feature but I can't find any official information about it.
So my question is, where can I find some official specs that explain the technical reasons whereby this isn't possible?
Official specs:
http://developer.apple.com/library/IOs/#documentation/AppleApplications/Reference/SafariWebContent/Introduction/Introduction.html#//apple_ref/doc/uid/TP40002079-SW1
Unfortunately, the official specs will not answer your question.
Generally, with forms on iOS safari, the keyboard will stay open until the user chooses to close it. When you auto-focus the next form input, does it close the keyboard?

can i detect whether a web user has a software keyboard using javascript?

I'd like to have the search field on my website automatically gain focus when the user loads the page, but i don't like how that pops up the keyboard for users on smartphones/tablets. Is there any javascript property I can use to detect whether or not the user has physical keyboard connected?
I'm not sure about that...but if you check this link out, it'll show you how to detect whether a user is on a mobile platform or not. you could make your decision based on that?

Forcing keyboard to display when a text input is selected

The scenario, I have an input text field I'm doing partial auto-complete on (exactly like the Tags input field on Stack Overflow... because that's what is, basically).
As a user is typing, I suggest things they may typing; the user then clicks one the suggestions, it replaces a bit of the fields content, and places the cursor after where the insert occurred.
All this works, but after the insertion the software keyboard isn't shown anymore. You can replicate this on the desktop Stack Overflow site.
The code on SO isn't exactly the same, though the symptom is.
Here's the actual code called after the text is inserted into the text field.
$(field).focus()[0].setSelectionRange(newCaretPos, newCaretPos);
(Yes yes, setSelectionRange is non-standard; but it works on all the mobile devices I care about just this moment, so ignore it for now)
On android, iphone, etc. this works fine (the keyboard "flickers" but I'm willing to live with it.
So, the question basically boils down to: How can I force the onscreen keyboard to appear on Windows Phone 7 (Mango update)?
Sorry, there is no guaranteed way to force the SIP to display in WP7. :(
Normally setting the focus on the textbox would force the keyboard. Have you tried just setting the focus? (i.e. not setting the selection range)

Categories