jqueryMobile datebox and webshim + checkValidity()

Question

Im using datebox and want some validation on my input if there isn't any value.

<input name="fromDate" id="fromDate" type="date" data-role="datebox" required = "" data-errormessage="error">

Im using webshim and it work great if I remove data-role="datebox". Is their any way to make it work with datebox?

Answer 1

This is a datebox issue with HTML5 formvalidation. datebox is setting the input to readonly, which means in HTML(5), that the field should not be validated (willValidate = false). If you remove the readonly attribute or set readOnly property to false, it works again.

Why don't you use webshims' datepicker (see some variations: http://jsfiddle.net/trixta/VNuct/).

$.webshims.polyfill('forms forms-ext');

If you use type="date" you shouldn't use datebox, either unless you make it more HTML5 compatible (i. e. always yyyy-mm-dd format and so on)

The best thing here: You can replace UI in all desktop browsers and leave the native implementation in modern mobile browsers, which means, less code to download and execute. (But of course you can use styleable datepickers everwhere, if you want).

If you need a specific feature for the datepicker of webshims let me know.