Don't show keyboard on iOS - javascript

Is there a way to NOT show the on screen keyboard on a website (loaded in safari) when a user clicks on an input type="text" field? I have javascript written to popup a mini "keypad" which I'd like to use instead.

I guess you could try to set the input disabled (disabled="disabled"), show your popup on click and finally update the field content via JS.

You cannot change device behavior from your javascript or website. Especially not if the user has disabled javascript.
The only thing you could do is to allow for all inputs and do server side validation to exclude the phrases or characters you do not wish to be entered.
HTH

In a custom app of course you can. In safari I don't think so.

Related

Enter text into a dialog box using javascript

I am building a UI testing framework which uses a headless browser (phantomJS in my case) to interact with html documents - without using jQuery I need to display a prompt (which is fine) and then programmatically enter text into the prompt dialog and then click OK, all with pure javascript. This will then add some text to a div so that I can verify the result.
Everything I have read online seems to suggest that this is not possible as the prompt/dialog boxes are built-in to the browser itself and not part of the DOM. I cannot see any properties/methods on the DOM to get the dialog and document.activeElement is returning me back the page, not the prompt. So I'm stumped.
How do I do this?
Alert & prompt are not part of DOM, they are part of browser. You can't simulate their invoke behavior from your code.
I think you need an external program (i.e. a program that runs besides the browser) which can detect prompt windows from the browser, and then fill them with text and submit them. I suggest you start with programs that can simulate key strokes like this user asked.

Search input field is blocking on Android (website)

Minor bug I'm trying to fix on Android devices accessing a site.
Flow goes like this:
User inputs text, list returns answers.
User clicks li element, is scrolled to the next page (ng Anchorscroll).
User is then at the top of next page, and can enter next input.
This is fine on iOS and web, but the keyboard is blocking on Android.
I hope this doesn't violate SO terms, but here is a video of the problem with my web app (I won't upload the code).
https://youtu.be/YwXRV_APMOQ
I have tried using conditions such as ‚ "if Androiddocument.activeElement.scrollIntoViewIfNeeded();
On resize $(input).focus();, and even onclick="window.location.href="#destination"
But none are working.
Looking for some sort of work around or help, thanks! :)
Found a work around. On click, focus on the next input. This pulls the input into the screen on Android, which is the behaviour needed.
(I've used Angular method, but can you any language)
How to set focus on input field?

Auto Focus Form Element on iPhone/iPad

I'm trying to create a web application that automatically focuses the text input box upon page load.
However, I know that the 'autofocus' attribute isn't supported in mobile safari. The reason I need it to autofocus is because I am developing a web application so to say, and it basically requires the user to use their bluetooth scanner to send input to a PHP page that then POSTs that data (and hence, leaves the page briefly). Upon return, I wish for the box to be focused again, ready for the next scan. And as you may have guessed, my client wishes to use an iPad/iPhone.
The input is essentially just a keyboard wedge, a series of keyboard strokes will be sent wherever the focus is.
I've tried using the JavaScript and jQuery code below to no avail;
$( document ).ready(function() {
$( "#scan-input" ).focus();
});
Didn't work. And;
function formfocus() {
document.getElementById('scan-input').focus();
}
window.onload = formfocus;
Didn't work either when placed at the bottom of the page(s).
I've tried searching for this problem and found;
How can you autofocus on a form field in iPhone Safari?
But there wasn't any helpful information returned either.
Now when I use the JavaScript and jQuery code posted above, it does infact work on my web browsers but again, not on the iPad or iPhone (I'm using an iPhone for testing with an incognito window each time to clear cache as a precaution).
Does anyone know a way to force the focus to a text input box on iPad/iPhone?
For usability reasons all the focus() functions are ignored by Safari in iPhone/iPad for usability reasons
Quora

Show mobile keyboard without input element

I wanted to show the mobile keyboard in my responsive site. First at i tried to place a hidden input, with placeholder "tap here", but on this input i have an event, which when fires reloads the dom, and bucause of this a cannot able to show the keyboard.
The question is, there is a way to show the keyboard without an input? I'm using HTML5 doctype, and jQuery 2.
Thanks for the answers!
I'm afraid you can't open the keyboard without using a input.
For more information you can read the following thread:
Show virtual keyboard on mobile phones in javascript
If it is for a game, the best manner is create a propper layout with the buttons you want to use.

Hide toolbar above iPhone keyboard, PhoneGap

I'm developing a iPhone app using PhoneGap. In the app there is a page contains only one textarea for user's input. As there is no other input field on this page, I want to hide the toolbar above the keyboard to give user more free space. Is there any way to do so? using javascript
you can Hide it by adding this to config.xml:
<preference name="HideKeyboardFormAccessoryBar" value="true"/>
http://docs.phonegap.com/en/3.4.0/config_ref_index.md.html#The%20config.xml%20File
I don't know whether this is directly possible with phonegap API but you can change this behavior with native code by writing a PhoneGap plugin to do that.
Refer below links for more detail (they are not exact but will give you the required detail):
Programmatically align a toolbar on top of the iPhone keyboard
http://gabriel-tips.blogspot.in/2011/05/input-accessory-view-how-to-add-extra.html
Try this cordova plugin
https://github.com/don/KeyboardToolbarRemover
Answered on this duplicate thread too Phonegap iOS6: Proper solution to Remove form assistant bar (prev, next, done)
There is a way. This guy has done it by making modifications in the AppDelegate.m. You can find description at this link under bonus code section.
You can also refer the code for same developed by Kerri Shotts Code Here
Now that the done button is gone i am trying to figure out how to make the keyboard disappear. This will be everybody's next step.

Categories

Resources