I'm looking for another set of eyes to take a look at the html and css of this page https://www.smartcrowd.ae/e-book/ on their iphone.
For some reason on Iphones only the form will not allow the user to tap into the phone number field. No matter where you tap in the input field, it will not allow you to type anything.
On safari, on desktop, it works but only if you enter the country code first.
It's working fine on google chrome, and firefox and I just can't find what the issue is.
The form is using a third-party plugin which generates the country code field, which seems to be a problem. If I deactivate the plugin the phone number input field works fine.
I've been racking my brain for the last day trying to figure this out.
Related
I have a list of phone numbers on my iOS App - all consisting of a simple table layout, with the normal 123-123-1234 syntax. However, one of the phone numbers has a different menu popping up within my iOS App - in that, it's showing a verified number and allowing a user to text or call the number.
Does anyone know why? Thanks in advance!
This did not work on the actual iPhone X hardware
http://braindrain.developmentserver.me/webapp/page/login
If you tap the username field and type, the cursor moves with no text being displayed.
I’m not sure how to fix it. Any help would be appreciated.
Looks like the input is getting updated when you start typing.
I would investigate the angular part of this form.
On iOS 8.0 devices when in Safari, users can enter additional characters to input fields with a max-length attribute.
Steps to Reproduce:
Create a html page with a input field that has a max-length attribute
Navigate to the page on an iOS device running iOS 8.0 or later.
Fill the input field with characters until you reach the max-length value
Move the writing cursor to somewhere in the middle of the entered characters
Enter additional characters. This will then make the length of the input value exceed the max-length attribute.
I used the following site to replicate this issue: http://www.wufoo.com/html5/attributes/03-maxlength.html
Should also note that textarea tags behave normally. I only noticed this on input tags.
I've confirmed this only occurs on iOS 8.0 devices.
I've submitted this bug to Apple via the Bug Tracker, but was wondering if anyone else ran into this issue and if so, if they discovered a solution/workaround.
As part of my login and registration forms, if there are errors then it will autofocus the related field. Actually, it not as simple as I thought. Let me try to explain!
Basically, on this project, pages are loaded with AJAX. Forms may include an autofocus attribute. This works great, but on mobile it just shows the cursor without bringing up the keyboard, meaning you still have to tap the input to start typing.
Am I missing something, or do I have to double-up the focussing with something like
document.querySelector("[autofocus]").focus();
// with appropriate verification that the element exists, of coursr
In mobile devices (at least in Apple's Safari), the keyboard isn't allowed to show up without the user clicking on the input field. It's by design, and I don't think there is much you can do about it.
http://www.quora.com/Mobile-Safari-iPhone-or-iPad-with-Javascript-how-can-I-launch-the-on-screen-keyboard
I'm working on updating some form inputs to HTML5. I'm not interested in validating the data so much as having the numeric key pad on mobile devices. Input type 'tel' seems to do what I want, I get the numeric keypad on iPad/mobile. Input type 'number' will also give me the numeric keypad, but it also includes the spinner box which I don't want.
What I want to know is if it's safe to use type="tel" on a credit card input? Or should I use type="number" and try to disable the spinner somehow. I was reading that disabling the spinner can crash Chrome which isn't a trade off I'm willing to make.
Also, for the time being we're using the exact same site for mobile and non-mobile users.
I looked at this and just tried this on my Xoom with the built in browser and FF mobile (with a desktop UA string) and the tel input would seem to work just fine for this.