Standard HTML5 wprowadza do formularzy kilka nowych kontrolek. Ma to ułatwić projektowanie stron internetowych.
Typ kontrolki |
Opis |
Obsługa |
|
określa kontrolkę w której można wybrać kolor |
|
|
określa kontrolkę w której można datę |
|
|
określa kontrolkę w której można wybrać datę i czas lokalny |
|
|
określa kontrolkę, w której podajemy adres email |
|
|
Określa kontrolkę w której wybieramy miesiąc |
|
|
określa kontrolkę w której wybieramy liczbę |
|
|
określa kontrolkę w której wybieramy liczbę z pewnego zakresu, zdefiniowanego przez twórcę witryny |
|
|
kontrolki używa się do wpisywania wyrażeń do wyszukania. Zachowuje się jak zwyczajne pole tekstowe |
|
|
pozwala na wpisanie numeru telefonu. Przeglądarka sama waliduje wpisane dane |
|
|
Pozwala na wybranie czasu h m |
|
|
Pozwala na wpisanie adresu url. Przeglądarka waliduje wpisane dane. |
|
|
Pozwala na wybranie tygodnia. |
Jak widzicie na dzień dzisiejszy (29-11-2017r.) nie wszystkie zaktualizowane przeglądarki wspierają nowe kontrolki. Najlepiej wypada tutaj Microsoft Edge, Google Chrome i Opera. Jeżeli przeglądarka nie wspiera danego typu pola to wyświetla pole tekstowe.
W kontrolkach można używać atrybutów, które również wprowadza HTML5
Atrybut |
Opis |
max |
maksymalna wartość. |
min |
minimalna wartość. |
pattern |
określa w jaki sposób sprawdzić poprawność wpisanych danych. Używa się w tym atrybucie wyrażeń regularnych. |
required |
wymagane uzupełnienie kontrolki. |
step |
określa krok przy kontrolkach numerycznych. |