Demos
DateTime TagHelper
The ASP.NET Core 6.0 - Homegrown Analytics Project (HAP) creates and stores artifacts with a DateTimeOffset property named CreateDate which is set to DateTimeOffset.UtcNow. The HAP user interface allows selecting a date and time to view the chronological data with a DateTimeTagHelper class which renders the HTML for the Now and Set buttons and an input with the type set to datetime-local. The <input type="datetime-local"> doesn't provide a way to set the time zone and/or locale of the date/time control. The HAP and this demonstration implement a TimeOffset cookie which allows converting the user selected date and time to Coordinated Universal Time (UTC). This demonstration implements a PageModel DateTimeOffset property named DisplayDateTime. The default for DisplayDateTime is DateTimeOffset.UtcNow which needs to be converted to the client's current date and time.
Display: 07/27/24 07:29 GMT
With Offset: 7/27/2024 7:29:23 AM +00:00
UTC: 07/27/24 07:29 GMT
Server: 7/27/2024 12:29:23 AM -07:00
Because of the limited browser support for datetime-local, and the variations in how the inputs work, it may currently still be best to use a framework or library to present these, or to use a custom input of your own. Another option is to use separate date and time inputs, each of which is more widely supported than datetime-local. See MDN - <input type="datetime-local"> and Can I use datetime-local?.
I like this control on mobile even more.
