Html 'required' attribute only works in preview browser

Question

I have a html page with the following user inputs

...
  <form action="website.php" id="mainform" method="POST">
...

<strong>Departure date</strong><span>*</span>:
<input type="text" id="datepicker" name="departuredate" required/>

 <strong>Return date</strong><span>*</span>: 
 <input type="text" id="datepicker2" name="returndate" required/>

...

 <input type="email"  name="email" required/>
 <input type="submit" value="Submit"/>
 </div>


 </form>

...

The required feature prompts the user to fill in the field if it is left blank. However, it only seems to be working in Dreamweaver's preview browser. When uploaded to my site, it has no effect at all.

Any help would be greatly appreciated.

Andrew

Answer 1

According to Dive Into HTML5, (today, 27/09/13) the required attribute is supported in

• IE 10+
• FF 4+
• Chrome 10+
• Opera 9+

(not in Safari, not in Android)

Maybe you should implement a fallback feature in Javascript, anyways, until this gets better cross-browser support.

EDIT (to reflect Mr Alien's comment): You should also always have a Server-Side validation feature, because Javascript can be disabled or edited quite easily.