Search code examples
javascripthtmlmodernizr

Detecting input type support of date and datetime types?

I try to use Modernizr to detect the support for date and datetime input fields (HTML5), but those variables always return false, even when they are supported (i.e. in Chrome): 

if(Modernizr.inputtypes.datetime) {
    jQuery("#what").html("Yes, I know datetime input fields.");
} else {
    jQuery("#what").html("Sorry, what is a datetime input field?");
}
#what {
    padding : 2em;
    margin  : 2em;
    text-align : center;
    
    border : 1px solid #000;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="what">Well... I'm not sure.</div>

By researching this problem it seems this bug is an old habit.

How can I solve it?

Solution

  • datetime is not supported on chrome or firefox.

    https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime

    For future ref you can use: https://developer.mozilla.org/

    Use Modernizr.inputtypes['datetime-local'] or Modernizr.inputtypes['date'] instead