How to set date format for input HTML control

Browsers which support date inputs will use the user's preferred date format for displaying and entering the date. There is no way to override that, since it would be confusing for the user.

The value of the date input will always use the yyyy-MM-dd format, to ensure that the value is unambiguous.

Browsers which don't support date inputs - and that includes all versions of IE - will display a simple text input containing the raw value. There will be no validation, no localised formatting, and no date picker. You will need to use a custom Javascript date picker control in those browsers if you want to provide a user-friendly way to select a date.

The script to detect whether the browser supports date inputs is fairly simple - this StackOverflow answer[^] has a good example:

function checkDateInput() {
    var input = document.createElement('input');
    input.setAttribute('type','date');

    var notADateValue = 'not-a-date';
    input.setAttribute('value', notADateValue); 

    return (input.value !== notADateValue);
}

If that function returns false, you'll need to use a Javascript date picker control.

Can I use... Date and time input types[^]