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.
Related
currently I'm building an application in Reactjs and working on a task.
The task includes select/highlight text from the page and display that selected/highlighted text in the input field (as shown in the photo)
Here I have implemented logic for this by using onMouseUpCapture (also I have tried onMouseUp) event from react and got the selected/highlighted text from window.getSelection().toString() and it was working as expected when I view this page on browser from laptop/computer.
But when I open the same application from a mobile browser I was not getting the selected/highlighted text to the input field.
Can anyone help me to know, are there any other event listeners that we need for mobile browsers or how to make it to work in mobile browsers. I did some google but couldn't find a solution for this. Thanks in advance :)
You have the touch events when using mobile browsers, I believe that the counterpart for onMouseUp event in mobile is the onTouchEndevent.
You can read more about it in here: https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/ontouchend
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?
we are developing an application which is both mobile and desktop, when we use .focus() on the mobile version the keyboard is not showing up, we try by triggering a click within the focus function $('#numeroCheque').focus(function(){
$('#numeroCheque').trigger('click');
});
but still no keyboard is shown, does anyone faced this issue before, and what can we do to solve it. Thanks.
As I understand, you can't set the focus to an input element programmatically on mobile. There needs to be some kind of user interaction. If building out a Cordova application, you can disable this using the KeyboardDisplayRequiresUserAction setting in your config file. But that is only if you wish to wrap your application in Cordova.
ref: https://cordova.apache.org/docs/en/2.7.0/guide/project-settings/ios/
The other option is to set the input element attribute autofocus but even this I believe won't work on mobile either.
make sure your keyboard element has native support for keyboard interaction and that the element can receive keyboard focus across different platforms.
also make sure the tabindex attribute of .focus() is correct.
Focusing is not enough, you need a click event to trigger focus, and wait until the page is fully loaded.
$(document).ready(function() {
$('#numeroCheque').click(function(e){
$(this).focus();
});
});
I don't actually want to do this; I'm just curious if it's possible. Apparently there are some hacky ways to check whether an on-screen keyboard is visible; however, I'm wondering if you can actually dismiss the keyboard using JavaScript.
That is, if you have a form that the user is filling out, and they enter an input field so the keyboard appears, is there any way to make it disappear?
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.