Geek Answers Handbook

Bootstrap "required" form confirmation pop-up does not work on ipad (safari or chrome)

This markup works great on desktop browsers

<form class="form-inline" action="/action/sign-me-up" method="post" onsubmit="return false;"> <input type="email" placeholder="Email" class='email' required title="Join our email list"> </form>

If I submit the form without a valid input email address [type = email], I get a pop-up message saying: "Please fill this field" and the form will not be submitted.

However, on the ipad, I get a real-time confirmation (red frame) when the user enters an email, but I DO NOT get a popover if they get to submit.

Is there an easy workaround, or do I need to use a jquery plugin?

+4
source share
1 answer

The message is the default browser caused by the HTML5 required attribute. Unfortunately, iOS and indeed many other browsers do not yet support it.

http://caniuse.com/form-validation

We have only one and the same problem that we solved with the Webshims library - http://afarkas.imtqy.com/webshim/demos/ , which is written in jQuery and built on top of Modernizr.

+6
source

More articles:


All Articles