First of all, there are some questions here on SO on this topic, but none of them provide a solution or practical suggestion to reach the goal, so I'll try my own question.
Here's the code with some basic inputs, datetime-local, date and time, taken from W3CSchools website and expanded a bit.
<!DOCTYPE html>
<html>
<body>
<h1>Show a Date and Time Control</h1>
<form action="/action_page.php">
<label for="birthdaydatetime">Birthday (date and time):</label>
<input type="datetime-local" id="birthdaydatetime" name="birthdaydatetime" step="900">
</br>
<label for="birthdaydate">Birthday (date):</label>
<input type="date" id="birthdaydate" name="birthdaydate">
</br>
<label for="birthdaytime">Birthday (time):</label>
<input type="time" id="birthdaytime" name="birthdaytime" step="900">
</form>
<p><strong>Note:</strong> type="datetime-local" is not supported in Internet Explorer 11 or prior Safari 14.1.</p>
</body>
</html>My goal is to have a visual 15 minutes step in the time selection. Data is saved in a DATETIME field in my database, but I can manipulate that in JS before calling the save method.
Is this doable with an easy HTML-JS workaround or shall I use a library like https://getdatepicker.com/
inputdoesn't reliably work with thestepattribute across all browsers. Some browsers support it fully, Some browsers (specifically Edge) ignore it. Due to poor cross-browser compatibility you would have to implement some sort of custom JavaScript to get what you want. And for that reason it'll probably save you time and effort to just use a library instead.