title: The <input required> attribute doesn't work on iOS devices
body: <p>I am having a problem trying to get my HTML form to work on iOS devices.  The "required"  attribute put under the input element works fine on any desktop web browser, but not on the mobile iOS Safari.  The problem is, I can hit "submit" on my form the mobile device, and it "submits" even without any content.  </p>
  
  <p>Help in this area would be much appreciated.</p>
  
  <p>Following is the HTML form code in it's entirety (without the CSS.)  The full thing can be viewed at <a href="http://www.calvarybaptistelkhart.org/test/contact/contact.html" rel="nofollow">http://www.calvarybaptistelkhart.org/test/contact/contact.html</a></p>
  
  <pre><code>&lt;form action="GOOGLE-SPREADSHEET-RESPONSE" method="post" target="hidden_iframe" onsubmit="submitted=true;"&gt;
          &lt;h1&gt;Contact Form&lt;/h1&gt;
          &lt;hr&gt;
          &lt;ol style="padding-left: 5px"&gt;
          &lt;div class="name-email"&gt;
            &lt;div class="name"&gt;
              &lt;div dir="ltr" class=""&gt;
                &lt;div class=""&gt;
                  &lt;label aria-hidden="true" class="" for="entry_516852872"&gt;
                  &lt;div class=""&gt;Full Name
                    &lt;label for="itemView.getDomIdToLabel()" aria-label="(Required field)"&gt;&lt;/label&gt;
                    &lt;span class="astricks"&gt;*&lt;/span&gt;&lt;/div&gt;
                  &lt;div class="" dir="ltr"&gt;&lt;/div&gt;
                  &lt;/label&gt;
                  &lt;input required type="text" name="entry.516852872" value="" class="" id="entry_516852872" dir="auto" aria-label="Full Name  " aria-required="true"   title="Please enter your full name"&gt;
                  &lt;div class=""&gt;&lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
            &lt;br&gt;
            &lt;div class="email"&gt;
              &lt;div dir="ltr" class=""&gt;
                &lt;div class=""&gt;
                  &lt;label aria-hidden="true" class="" for="entry_1989288897"&gt;
                  &lt;div class=""&gt;Email Address
                    &lt;label for="itemView.getDomIdToLabel()" aria-label="(Required field)"&gt;&lt;/label&gt;
                    &lt;span class="astricks"&gt;*&lt;/span&gt;&lt;/div&gt;
                  &lt;div class="" dir="ltr"&gt;&lt;/div&gt;
  
                  &lt;/label&gt;
                  &lt;input required type="email" name="entry.1989288897" value="" class="" id="entry_1989288897" dir="auto" aria-label="Email Address  Please enter a valid email address" aria-required="true" title="Please enter a valid email address"&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
            &lt;br&gt;
            &lt;div class="subject"&gt;
              &lt;div dir="ltr" class=""&gt;
                &lt;div class=""&gt;
                  &lt;label aria-hidden="true" class="" for="entry_686432534"&gt;
                  &lt;div class="subject"&gt;
                    &lt;label for="itemView.getDomIdToLabel()" aria-label="(Required field)"&gt;&lt;/label&gt;
                    &lt;span class="astricks"&gt;&lt;p&gt;&lt;/p&gt;&lt;/&gt;&lt;/span&gt;&lt;/div&gt;
                  &lt;div class="" dir="ltr"&gt;&lt;/div&gt;
                  &lt;/label&gt;
                  &lt;ul class="" role="radiogroup" aria-label="Subject  "&gt;
                    &lt;li class=""&gt;
                      &lt;label&gt;&lt;span class="qField"&gt;
                        &lt;input required type="radio" name="entry.1726780033" value="Question" id="group_1726780033_1" role="radio" class="" aria-label="Question"&gt;
                        &lt;/span&gt; &lt;span class="subjectQuestion"&gt;Question&lt;/span&gt; &lt;/label&gt;
                    &lt;/li&gt;
                    &lt;li class=""&gt;
                      &lt;label&gt;&lt;span class="cField"&gt;
                        &lt;input required type="radio" name="entry.1726780033" value="Comment" id="group_1726780033_2" role="radio" class="" aria-label="Comment"&gt;
                        &lt;/span&gt; &lt;span class="subjectComment"&gt;Comment&lt;/span&gt; &lt;/label&gt;
                    &lt;/li&gt;
                    &lt;li class=""&gt;
                      &lt;label&gt;&lt;span class="bField"&gt;
                        &lt;input required type="radio" name="entry.1726780033" value="Bug Report" id="group_1726780033_3" role="radio" class="" aria-label="Bug report"&gt;
                        &lt;/span&gt; &lt;span class="subjectBug"&gt;Bug report&lt;/span&gt; &lt;/label&gt;
                    &lt;/li&gt;
                  &lt;/ul&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
            &lt;br&gt;
            &lt;br&gt;
            &lt;div class="message"&gt;
              &lt;div dir="ltr" class=""&gt;
                &lt;div class=""&gt;
                  &lt;label aria-hidden="true" class="" for="entry_943921138"&gt;
                  &lt;div class=""&gt;Your Message:
                    &lt;label for="itemView.getDomIdToLabel()" aria-label="(Required field)"&gt;&lt;/label&gt;
                    &lt;span class="astricks"&gt;*&lt;/span&gt;&lt;/div&gt;
                  &lt;div class="" dir="ltr"&gt;&lt;/div&gt;
                  &lt;/label&gt;
                  &lt;textarea required name="entry.943921138" rows="8" cols="0" class="" id="entry_943921138" dir="auto" aria-label="Your Message:  " aria-required="true"&gt;&lt;/textarea&gt;
                  &lt;div class=""&gt;&lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
            &lt;input type="hidden" name="draftResponse" value="[,,&amp;quot;1157424860243765947&amp;quot;]
  "&gt;
            &lt;input type="hidden" name="pageHistory" value="0"&gt;
            &lt;input type="hidden" name="fbzx" value="1157424860243765947"&gt;
            &lt;div class="submit"&gt;
              &lt;table id="navigation-table"&gt;
                &lt;tbody&gt;
                  &lt;tr&gt;
                    &lt;td class="" id="navigation-buttons" dir="ltr"&gt;&lt;input type="submit" name="submit" value="Submit" id="ss-submit"&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                &lt;/tbody&gt;
              &lt;/table&gt;
            &lt;/div&gt;
          &lt;/ol&gt;
        &lt;/form&gt;
  </code></pre>