How do I force seconds to appear on an HTML5 “time” input control?

Question

When I use JavaScript to set the value of an HTML5 \"time\" object, like this:

document.getElementById(\"settime\").value = \"13:24:59\";

I

Answer 1

Set the step attribute.

Ex: <input id="settime" type="time" step="1" />

document.getElementById("settime").value = "13:24:00";

<input id="settime" type="time" step="1" />

A note about the step attribute:

The step attribute can be used with a numerical input value to dictate how granular the values you can input are. For example, you might want users to enter a particular time, but only in 30 minute increments. In this case, we can use the step attribute, keeping in mind that for time inputs the value of the attribute is in seconds. For example, a 30 minute increment would have a step value of 1800. <input type="time" step="1800">