Pazar , 28 Mayıs 2017
Anasayfa » WEB » HTML » HTML5 Datalist Etiketi

HTML5 Datalist Etiketi

Çoğu web uygulamasında karşılaşmışsınızdır. Bir kaç karakter girdiğimizde bize yazılabilecek  metinleri getirmektedir.  Her javascript frameworkün otomatik tamamlama özelliği vardır. Bu yazıda bunların dışında HTML5 ile gelen datalist etiketi açıklayıp, basit autocomplete özelliği kazandıracağız.

 Datalist: <datalist> bir ID ve içinde listelenecek her nesne için OPTION etiketi ve bu etiketlere ait value değerlerini almaktadır.

Datalist tanımladıktan sonra kullanılacak etikete belirlediğimiz ID değeri list niteliğine girilmesi yeterli olacaktır.

Text kutusunda bir kaç har girmeye başladığımızda eşleşen kayıtlar listelenecektir. Jquery yada JS frameworklerdeki kadar görsel açıdan mükemmel görünmeyebilir. Ama kullanımı ve ihtiyaç duyduğu kaynak bakımından çok işlevsel bir etiket.

Destekleyen Tarayıcılar

Chrome Internet Explorer FireFox Safari Opera
20.0+ 10.0+ 4.0+ Desteklemiyor 9.0+

 

Faydalanılan Kaynaklar

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist

http://www.w3schools.com/tags/tag_datalist.asp

http://html5doctor.com/html5-custom-data-attributes/

 

Hakkında Hayri

İlginizi Çekebilir

HTML Bağlantı Oluşturma

Bu yazıda HTML ile bağlantı oluşturma ve bağlantılarda kullanılan bazı önemli niteliklerin(attribute) kullanımını anlatacağım. HTML …

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir