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.
Related
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();" />
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.
I am using Label and image divs with radio inputs. Everything is working good except when I run that on Iphone radios and checkboxes work on double click only.
Test on :
https://vpcl.outgrow.co/phone
I'm not exactly sure what is causing it, but it may help you to use Modernizr. It allows you to detect whether a user is using a device that uses touch events or click events, and which can help with interactive responses on different devices.
I have have also found that sometimes If I have a hover I will have to double click because mobile doesn't use hover, Modernizr helps in cases like that as well.
In Windows phone 8.1 universal app, Appbar currently support only icons, not the buttons. If i use the button, Button is hidden below the keyboard.
I need help to achieve either one of the below
I want to show the Button below the Keyboard, Any ways to achieve it?
Or, Move the Button above the Keyboard when keyboard appears. When Keyboard is not shown, Button should be at the Bottom of the page. Is there any way to do this?
It helps User to see the Button clearly all the time.
React on an OnInputPaneShowing event. The size of the input control is passed into this function and you can update the position of the button according this size.
See MSDN respond to the keyboard presence and MSDN occluded rect property for more info on how to do this.
Take a look at this sample: http://jsbin.com/imivek/1/edit
Clicking the text field, which is part of the label, behaves oddly in Firefox (tested in v17.0.1):
Clicking it once will give it focus for a very brief period of time, after which the focus moves to the radio button.
Clicking it twice shortly after each other will maintain focus.
Focusing it by other means (f.e. tab) will work fine and as expected.
Handling the text field's click event and preventing it from bubbling up (e.stopPropagation() in jQuery terms) doesn't change anything.
Who can explain this behavior and recommend how to best work around it?
You may have only one form control inside a label. You have two. Your HTML is invalid so weird behaviour is to be expected as browsers attempt to compensate for your mistake.
Clicking it once will give it focus for a very brief period of time, after which the focus moves to the radio button.
You clicked on the label. That sets the focus to the radio button (since the label appears to be a label for it).
Clicking it twice shortly after each other will maintain focus.
Probably some sort of error recovery
Focusing it by other means (f.e. tab) will work fine and as expected.
You aren't clicking the label then
Handling the text field's click event and preventing it from bubbling up (e.stopPropagation() in jQuery terms) doesn't change anything.
It is native functionality, not scripted functionality.
Write valid HTML.
Why do you have two <input>'s in the same <label>? What are you trying to do? A label is supposed to be bound to one input element and act as a caption for it, so that when you click it, the input takes focus.
This is a FF bug
https://bugzilla.mozilla.org/show_bug.cgi?id=213519
Reported in 2003, still not fixed!