Focus html mobile - html

I am looking for a way to place the focus on an input field, without having the keyboard of the phone shown. The same as autofocus but after the page is initialised. Not focus() because like I said I don't want the keyboard to be shown. Does anyone know a way to do that? I am working with angular 5 if it can help. Thanks.

Nevermind. I found a way using a Timeout of about 100 milliseconds. On click I put the input field in readonly, which does not show the keyboard, then after the timeout, I remove the readonly allowing the input but not the printing of the keyboard.

Related

Html input number is not getting numeric keyboard input

Here is the input type number
<input type="Number" id="yPos" />
it is working fine and i am able to change it through mouse
But it is not getting numeric input from keyboard. How can i enable it?
Edit:
I found that UnitywebGL is creating this problem otherwise the keyboard input is working correctly in html controls.
Actually there is no issue with the html input field. It was related to the unity webgl:
Keyboard input and focus handling. By default, Unity WebGL will
process all keyboard input send to the page, regardless of whether the
WebGL canvas has focus or not. This is done so that a user can start
playing a keyboard-based game right away without the need to click on
the canvas to focus it first (source).
So the Unity canvas was consuming my all keyboard input. No matter I tried to enter/select my input control, it will not get input from keyboard. So I used
WebGLInput.captureAllKeyboardInput
to activate/deactive unity canvas input based on user selection.
First, correct the form. The type should be "number" without caps, i.e:
type="number"
Also check if you have turned off the num lock.

Hide Keyboard with onFocus event

I know it sounds a bit confusing, but I have an angular app that is supposed to run only on a mobile device with a barcode reader that automatically writes what it reads inside the focused input field.
I setted the app so that when the page is loaded my input field has focus and I want that the soft keyboard to be invisible so the user cannot manually write in this field.
The flow should seem like this: input -> autofocus -> (onFocus)="hideKeyboard()"
Autofocus is a custom directive that sets the dom element to be the focus in ngOnInit.
Thanks in advance for any tip.
There's a start here in this project, but when you click outside of the input (in the button) lose focus and the keyboard is hidden again. But yet, it's a start...
Try something like this.
<input id="id1" class="hidekeyboard"/>
$('#id1').<input_type>({
/* options */
});
$('.hidekeyboard').on('focus',function(){
$(this).trigger('blur');
});

HTML input not readonly without mobile keyboard

I am developing an on-screen keyboard. I want to disable keyboards of mobile devices while the osk is open. One way is to make input read-only, so that focusing on it not opening the keyboard. But using that solution, the user can't change cursor pointer (and also does not see any cursor while writing with osk) and can't select one part of text to delete.
Is there any other solution to stop mobile device keyboard from openning while focusing on input? Something like a specific attribute or styling value or etc.
Thnaks in advance. TG.
// UPDATE
one solution with readonly
EDIT:
Okay, to hide the keyboard for mobile users is not something you can prevent directly, but there is an alternative.
The "OnFocus" Event activates when a specific elements gets focused. this way you can add a bit of code to prevent a mobile keyboard from popping up.
this way we can add the "Blur()" method to it.
so it would look something like this:
<input type="text" name="noKeyboardForMobile" onfocus="blur();" />

How do I make Chrome's autocomplete drop-down appear only after I begin typing (instead of on initial mouse click)?

Please help!
Recently (probably with version 66), Chrome began displaying its autocomplete-suggestion drop-down on the initial mouse click into a search field instead of waiting until a character is typed.
How do I make Chrome go back to not displaying suggestions until I begin typing?
I have always made use of Chrome's suggestions drop-down for search fields, but I don't want or need to see a list of random suggestions just because I've clicked into an input field. I only want to see suggestions that match what I start to type (which is how it always worked until recently).
I tried disabling the "Single-click autofill" flag and even the "Show autofill predictions" flag as well, but these flags don't seem to affect the situation. Perhaps the term autofill in these flags doesn't refer to the same thing?
If anyone can help me with this, I'll be your best friend forever and ever!
Thanks for reading this.
I was having the same issue recently with a datepicker input. To get around it, I wrapped my inputs in a form and set autocomplete="off" in my form tag, as Chrome only recognizes that property for forms and not individual inputs. I added a keyup event so that if the input has text in it, autocomplete is re-enabled:
if (val.length > 0) {
$('#myForm').attr('autocomplete', 'on');
} else {
$('#myForm').attr('autocomplete', 'off');
}
You can also add an onBlur event to disable autocomplete suggestions each time you leave an input.

hide android keyboard on focus

I have a problem with my webapp.
Is there a way to hide the android keyboard on text input focus without losing the focus on the input?
Focus on page load works fine, because the field is focused and no keyboard is shown. I want the same behavior after re-focus on input.
Thank You
Maybe you should give keyboard customizing apps a try...might work. I personally prefer Redraw Keyboard, but there are many out there to choose from.