👀 Views: 78 💬 Answers: 1 📅 Created: 2025-06-09

html safari javascript HTML

I'm having trouble with I'm working with a question with the `<input type='date'>` element in my HTML form when viewed in Safari. While testing my form on multiple browsers, it works perfectly in Chrome and Firefox, displaying the date in the format 'YYYY-MM-DD' as expected. However, in Safari, when the form loads, the input shows an empty field, and when I try to set a value programmatically using JavaScript, it doesn't seem to update the field correctly. Here's a snippet of my form: ```html <form id="date-form"> <label for="appointment-date">Select Appointment Date:</label> <input type="date" id="appointment-date" name="appointment-date"> <input type="submit" value="Submit"> </form> ``` And I'm using the following JavaScript to set a default date: ```javascript const dateInput = document.getElementById('appointment-date'); const today = new Date(); const formattedDate = today.toISOString().split('T')[0]; // format YYYY-MM-DD dateInput.value = formattedDate; ``` When I inspect the input in Safari, it shows as an empty string, and when I try to submit the form, I receive a `Value is not valid` behavior. I've checked the console, and there are no JavaScript errors being thrown. Additionally, I've confirmed that my Safari version is up to date (Version 16.0). I've also tried a simple workaround by manually updating the value using a timeout, but that didn't help either. Has anyone else experienced this scenario with the date input type in Safari, and how can I ensure it displays the date correctly? How would you solve this?