html5必需的验证在浏览器上工作得很好，但在phonegap应用程序上却不能

Question

I am developing an app on phonegap (v 5.1.1) and using phonegap app for testing locally on android. I have created a form in html and for validation purpose I've used required property. In browser (firefox, chrome) it is working fine as it should be, while on mobile it does not validate anything. and submits. Why is this happening ? Does html5 required supported on android.

  <form id="LoginForm" action=""> <input type="email" name="email" id="inputEmail3" placeholder="Email" required> <input type="password" name="pwd" id="inputPassword3" placeholder="Password" required> <button type="submit">Sign in</button> </form> 

Thanks.

Answer 1

You're running Android 4.2.2 and "required" / form validation isn't properly supported there until newer versions of Android. caniuse.com has a good matrix of support here .

To cover all Android versions, you can use "required" but don't rely on it and also defensively code for missing values in your JavaScript when the user submits the form.

Answer 2

An interesting situation for iOS: now it is supported in Safari Mobile and when used with "Add to Home Screen" feature, however, once the app is built using Cordova, validation is just ignored .

Tested for required attribute, same device, almost the same navigator.userAgent :

Browser navigator.userAgent :

Mozilla/5.0 (iPhone; CPU iPhone OS 11_2 like Mac OS X) AppleWebKit/604.4.7 (KHTML, like Gecko) Version/11.0 Mobile/15C107 Safari/604.1

Cordova app navigator.userAgent :

Mozilla/5.0 (iPhone; CPU iPhone OS 11_2 like Mac OS X) AppleWebKit/604.4.7 (KHTML, like Gecko) Mobile/15C107