toscani icon indicating copy to clipboard operation
toscani copied to clipboard

Doesn't auto skip to next field in iOS8

Open tannyo opened this issue 10 years ago • 2 comments

Enter the credit card number and the mask moves over, but the input is still in the credit card field. If you tap the > (arrow) the cursor moves back to the date field and you can enter the date. If you do not tap the next field button it will give you an invalid credit card number.

tannyo avatar Nov 19 '14 23:11 tannyo

There is a problem with window.navigator.standalone and !Modernizr.touch both evaluating to false. I hope to investigate and find a solution tomorrow.

console.log( 'window.navigator.standalone: ', window.navigator.standalone );
console.log( 'Modernizr.touch: ', Modernizr.touch );

214: if (window.navigator.standalone || !Modernizr.touch) {
    // Focus on the credit card expiration input.
    $("." + opts.cardExpirationClass).focus().val($.trim($("." + opts.cardExpirationClass).val()));

    // Update instruction message
    helpers.updateInstruction(opts.messageExpiration);
}

caseydriscoll avatar Nov 25 '14 02:11 caseydriscoll

Yeah after some research I'm not sure what the intent was.

window.navigator.standalone returns true only for 'full screen' ios web apps, I believe when the page is saved to the icon screen. http://www.bennadel.com/blog/1950-detecting-iphone-s-app-mode-full-screen-mode-for-web-applications.htm

Modernizr.touch returns true for iOS devices, but the ! negates it, meaning for only non-touch screen environments.

These conditions only allow for non-touch devices or a touch device in full screen mode. For whatever reason, they didn't want to allow it for normal safari iOS browsing, as far as I can tell.

The (window.navigator.standalone || !Modernizr.touch) condition happens in 6 places, I just commented it out and it appears to be working fine. Your mileage may vary.

caseydriscoll avatar Nov 25 '14 14:11 caseydriscoll