Input time mit vorgabe
bearbeitet von
Moin,
`> Hi,
> Ist es irgendwie möglich eine `<input type="time">` Feld vorzugeben welche Uhrzeiten man nur auswählen kann?
In der Regel, ja.
`<input type="time" name="uhrzeit" min="9" max="22" value="19:09">`
Wobei Min am 9 Uhr startet und Max dann heißt, bis 22 Uhr
> Ich hab bis her immer die möglichen Zeiten als Liste ausgegeben und dann mit Radio-Button auswählen lassen. Zum Teil wird die Seite dann aber extrem lang.
> Oder hat jemand eine andere Idee wie ich das anschaulicher darstellen könnte?
Wieso ein Radiobutton, kennst du das `<datalist>` Element?
`<div id="timepicker">
<div class="time-show">
<span class="time">Zeit : </span>
<input type="text" name="time-hours" list="time-hours-select" min="9" max="22" placeholder="19">
<datalist id="time-hours-select">
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>17</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
</datalist>
<input type="text" name="time-minutes" list="time-minutes-select" min="00" max="59" placeholder="09">
<datalist id="time-minutes-select">
<option>00</option>
<option>09</option>
<option>15</option>
<option>30</option>
<option>45</option>
</datalist>
</div>
</div>`
Was mich an dieser Lösung stört. Bisher ist es mir noch nicht gelungen, die `<option>` Elemente mit CSS zu Rendern. Die werden noch vom OS gestyled, bzw vom Browser Stylesheet.
schönen Pfingtsmontag noch,
jens mueller