Şub 23

Html5′den önceki versiyonlarda veri giriş (input) tipi olarak “text”, “button”, “submit” vb. birkaç veri tipi akla geliyor. Html5′de ise web uygulamalarında ihtiyacımız olan renk,tarih,zaman vb. gibi birçok veri tipi bulunmaktadır. Yeni gelen veri tipleri aşağıda listelenmektedir.

  • color(renk)
  • date(tarih)
  • datetime(tarih-zaman)
  • datetime-local(yerel tarih)
  • email(e-posta)
  • month(ay)
  • number(sayı)
  • range(aralık)
  • search(arama)
  • tel(telefon)
  • time(zaman)
  • url
  • week(hafta)

color(renk)

color(renk), renk seçmemizi sağlayan veri tipidir. Şimdi ufak bir örnek yapalım.

 
Renk seçimi:  

Renk seçimi:

Yukarıdaki örneekte düğmeye tıklayınca, renk seçmemizi sağlayan pencere ortaya çıkıyor. İstediğimiz rengi seçip formu gönderdiğimizde rengin kodu (#RRGGBB) sunucuya “renk” adındaki değişken ile gönderilecektir.

date(tarih)

date(tarih), tarih seçmemizi sağlayan veri tipidir. Şimdi ufak bir örnek yapalım.

Tarih. 

Tarih.

Bu veri tipinin bulunduğu form sunucuya gönderilirse “tarih” değişkeninin değeri seçtiğimiz tarih olacaktır.

datetime-local(yerel tarih-zaman)

datetime-local(yerel tarih-zaman), yerel tarih ve zaman seçmemizi sağlayan veri tipidir.

Tarih-zaman: 

Tarih-zaman:

email(e-posta)

email(e-posta), yazı kutusuna e-posta adresinin yazılması için geliştirilmiş veri tipidir. Girilen metnin e-posta formatında olup olmadığını kontrol eder.

E-mail:
E-mail:

Tipi email olan veri giriş elemanına e-posta formatı dışında bir değer yazıp form gönderilmeye çalışıldığında uyarı çıkacaktır.

month(ay)

month(ay), bir ayı bulunduğu yıl ile beraber seçmemizi sağlayan veri tipidir.

Ay 

Ay:

number(sayı)

number(sayı), sayısal değerlerin girilmesi beklenen veri tipidir. max,min ve value özellikleri ile girilecek sayı kısıtlaması yapılabilir.

Değer: 

Değer:

Yukarıdaki örnekte sayı kutusuna 1′den küçük veya 5′den büyük bir sayı girilmez. Varsayılan değer de 3′tür.

range(aralık)

range(aralık), belirli bir aralıktaki sayıları grafiksel olarak seçmemizi sağlayan veri tipidir. number tipinde olduğu gibi max,min ve value özellikleri vardır.

Puan: 010

Puan: 010

Yukarıdaki örnekte 1 ile 10 arasında bir sayıyı seçmemizi sağlayan veri tipini görüyoruz.

search(arama)

search(arama), bildiğimiz yazı kutusunun aynısıdır. Herhangi bir özelliği yoktur. Yazı alanının arama için kullanılacağını gösterir.

Ara: 

Ara:

tel(telefon)

tel(telefon), yazı kutusuna telefon numarasının girilmesi için kullanılır.

Telefon: 

Telefon:

time(zaman)

time(zaman), veri tipi saat seçmemizi sağlayan veri tipidir.

Zaman: 

Zaman:

url

url adresi girmemizi sağlayan veri tipidir. Form gönderildiği zaman girilen verinin url formatında olup olmadığını kontrol eder.

Web adresi:
Web adresi:

week(hafta)

week(hafta), belirli bir haftayı seçmemizi sağlayan veri tipidir.

Hafta:

Hafta:

Kaynak: A.O.Mermerkaya, Html 5 Css 3, Abaküs Kitap Yayın Dağıtım Hizmetleri, İstanbul, 2015.

Yorum Yaz