CODEWITHSUNDEEP
javascripthtmlinput
Manpreet Narang
Manpreet Narang

Reputation: 95

Input Type Time to select only hours

Can I set input type time to just select hours, not to select minutes. I just want to select from and to for hours like 2:00 to 3:00 not with any minutes.

Upvotes: 3

Views: 19280

Answers (3)

Chase
Chase

Reputation: 3116

You can use the step attribute: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time

<form>
  <input type="time" required step="3600">
  <button type="submit">Submit</button>
</form>

Upvotes: 2

Udbhav
Udbhav

Reputation: 212

Use simple select tags as shown below:

<label for="from">From: </label>
  <select name="from" id="from">
    <option value="1">1:00</option>
    <option value="2">2:00</option>
    <option value="3">3:00</option>
    <option value="4">4:00</option>
    <option value="5">5:00</option>
  </select>

  <label for="to">To: </label>
  <select name="to" id="to">
    <option value="1">1:00</option>
    <option value="2">2:00</option>
    <option value="3">3:00</option>
    <option value="4">4:00</option>
    <option value="5">5:00</option>
  </select>

Upvotes: 3

GM-atteoni
GM-atteoni

Reputation: 455

you can use an input type="number" and adjust the values with attributes.. Like that:

<input type="number" id="yourId" name="yourName" min="1" max="24">

The user shoulb be able to input only numbers between 1 and 24 hours. To prettify your design you can use some label after the input field showing something like "Hour" to reference the plural.

Upvotes: 2

Related Questions