Samsung Internet default browser javascript autocomplete issue - javascript

I have an issue that only seems to happen in Samsung Internet default browser.
I am using the following where #query-mob is the id of a text input used for searching.
var places = ["Place1", "Place2", "Place3", "AndSoOn"]
$("#query-mob").autocomplete({
source: places
});
Selecting any of the values from the autocomplete then hitting 'search' should perform a search on the values chosen. This is working perfectly on all browsers I've tried, mobile and desktop, except samsung default browser.
To add, manually typing "Place1" instead of selecting from the autocomplete works fine, but selecting from the autocomplete will perform a blank search. i.e. it seems the chosen value is not being passed through correctly into the text field.
Any ideas? Also, is there a way I can debug this on the device? Finding it hard to see what's failing.
Thanks in advance

Related

Updating `enterKeyHint` resets the input value on Chrome Android

I'm updating the value of enterKeyHint dynamically in an autocomplete library. When there's a active item, the Enter key should use "go" (to hint that hitting Enter navigates to the item's link) and when there isn't (no query, no results), the Enter key should use "search".
This DOM updates works fine on most mobile browsers, except on Chrome Android. When the update happens, the input value is cleared.
I've reproduced the issue in isolation. The update kicks in at 5 characters.
Here are quick previews on a Galaxy S9:
With Firefox Android, the Enter key's label updates as expected and the input value doesn't change.
With Chrome Android, the Enter key updates but the input value is reset (causing new updates to the Enter key, etc.)
I'm suspecting an inconsistency between how mobile browsers implement the spec, since everything works as expected on Safari iOS, Chrome iOS and Firefox Android. However, I couldn't find anything online, it doesn't seem like this behavior has been reported before (I assume updating this propery isn't too commonplace).
Has anyone ever faced this issue, or understands it? Thanks in advance!

On any iOS Mobile Devices: Inputs within iFrames have issues determining when input is out of focus - Material Design -Recurly

Situation:
Material Design Floating Labels are stuck with a class="in-focused" even when the input is out of focus. The inputs also contain an iFrame generated from Recurly if that helps.
This seems to happen on (Chrome and Safari) browsers for any iOS Mobile device (iPads iPhones any version). Also, the inputs are all iFrames. Sometimes the cursor will disappear (version 9 and below) when you try to tap back into an empty input field as an additional error. The iFrames are generated from Recurly.
I believe there is an issue with Mobile Safari devices where it doesn't recognize a possible Blur event.
Question:
My goal is to remove the class="is-focused" from any element that is not in focus. What would you you recommend as a solution for this problem?
If you would like to reproduce the error you can see if you go to this url: https://pantaya.com/billing/payment (sign up a dummy account if you need to...) You will see the form that gives these errors.
All advice is helpful! Thank you!
Picture attached to see error:

File Input will not upload in Internet Explorer using Bootstrap File Input

So I am using IE to test the file input of my page - it simply doesn't work when you submit it will pass through the correct query string which it should when you submit but the file is not uploaded to the database.
I have tested this on chrome and firefox - and both work. This is the code:
Select your document
Select fileChange
×
I have noticed when I remove the divs/spans around the input - it works perfectly but of course then I have the inconsistency of the ugly input system which is handled differently on each browser.
Has anyone come across this before? Does anyone know any fixes.

Android browsers keyboard opens/closes on last input field focus

I'm getting some odd behaviour in the Chrome browser on HTC One and Galaxy S5.
I click on an input field to enter some data and the keyboard opens and immediately closes again.
I've noticed it only happens on the last available input field on my pages.
Has anyone encountered this issue before?
It works fine on the iPhone and desktop browsers.
Thanks
Ok...so it looks like it has something to do with android browsers redrawing the DOM whenever the keyboard appears. I have $(window).resize() function that is getting called each time the keyboard appears in this case. I may just switch it to use $(window).load().

WinJs textarea focus issue

When running http://ichord.github.io/At.js/ page in IE10, it works correctly in a sense it returns focus to textarea after selecting suggestion from autocomplete list. It also works when I use on screen keyboard and touch input (on surface rt or simulator).
When I try to run the same code as WinJs app, it works for mouse/keyboard selection, but when I select item using touch it doesn't return focus to textarea, which is really frustrating.
Is it known bug? Are there any known workarounds to it?
What it interesting it also doesn't hide on screen keyboard.

Categories