0

I am trying to create an html datetime-local field which tells the user they can only pick from certain dates. Previous answers (such as this one - Disable certain dates from html5 datepicker) have always suggested using MIN/MAX attributes. They fail to appreciate there is (perhaps more recently added) the List attribute which apparently can link to a datalist (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist#date_and_time_types). Whilst the example in the previous link uses time, it is apparently possible to do it with the datetime-local and I would expect the following to work (but of course for some reason it isn't).

<!DOCTYPE>
<html lang="en">
    <body>

        <label for="dateChoice">Choose a date:</label>
        <input type="datetime-local" list="dateList" id="dateChoice">

        <datalist id="dateList">
            <option value="05/06/2023">05/06/2023</option>
            <option value="07/06/2023">07/06/2023</option>
            <option value="2023-06-07"></option>
            <option value="2023-06-14"></option>
            <option value="2023-06-20"></option>
            <option value="2023-06-21"></option>
        </datalist>
    </body>
</html>

What am I doing wrong? From the examples I would suspect I was on the right track but when I run this, there is no indication of a suggested date??

Antony
  • 3,875
  • 30
  • 32

1 Answers1

0

Answer was quite obvious - because this is a datetime - the value options needed a time too!

Antony
  • 3,875
  • 30
  • 32