Flatpickr ile Minimalist Datetime Girdi Seçimi Yaratın
Oluşturulması en zor alanlardan biri tarih / saat seçimi. Geliştiriciler genellikle ay / gün / yıl için basit seçme menülerine başvurur veya işi yapmak için çeşitli eklentilere güvenir.
Seçili alanlar iyi çalışıyor ancak biraz tuhaflar. Bunun yerine, formunuzu, Flatpickr eklentisi. Bu bir sıfır bağımlılıkları olan ücretsiz, açık kaynaklı JavaScript takvim seçicisi.
Öyleydi akılda minimalizm ile tasarlanmış, bu yüzden herhangi bir web sitesi düzenine, herhangi bir web formuna sığabilir ve herhangi bir modern cihazdan kullanılabilir olmalıdır.
Bu eklenti hakkında güzel bir şey özel seçeneklerin çeşitliliği. Tarihlerin metin alanında nasıl göründüğünü ve takvimin nerede başladığını sınırlayabilirsiniz (varsayılan olarak “bugün”).
Ama sen de kesinlikle bir tarih seçici olarak kullan Zaman seçimine gerek yoksa. Bu seçiciyle, form boyunca daha fazla veri iletmenize izin veren yalnızca isteğe bağlı bir özelliktir..
Bir göz atın Örnekler sayfası Flatpickr'ı çalışırken görmek için.
Ayrıca hedeflenen seçenekleri ayarla tarih seçicisinin davranışını sınırlamak için, örneğin:
- Belirli tarihlere / aralıklara izin vermemek
- Sadece belirli tarihlere / aralıklara izin vermek
- Birden çok tarih seçimine izin verme
- “Menzil modu” bir başlangıç ve bitiş tarihi seçmek için
- Sadece bir tarih seçici, ya da sadece bir saat ya da her ikisi de birlikte tarih ve saat
Seçenekler pratik olarak sınırsız ve hepsi bu tek vanilya JavaScript eklentisiyle çalışıyor.
Mobil kullanıcılar genellikle yerel tarih seçiciyi tercih eder, ancak JavaScript’teki bir mobil ayar ile bunu geçersiz kıl. Bu şekilde, tüm cihazlarda çalışan aynı arayüze sahip olacaksınız..
Ve hatta bir polyfill ile IE9 desteği ekleyin Bu, bunu en iyi desteklenen tarih seçici eklentilerinden biri yapar..
Kurulum basit npm, Bower ve Yarn komutları. Veya kaynak dosyaları indirebilirsiniz doğrudan GitHub'dan eğer o rotayı tercih edersen.
Bilmeniz gereken her şey sizi gösteren kurulum sayfasında bulabilirsiniz. dosyaları başlığınıza nasıl ekleyebilirsiniz & Herhangi bir alanda bu tarih seçici nasıl aranır. Kolayca herhangi bir tasarıma uyacak şekilde tasarlanmış, en iyi tarih seçme eklentilerinden biri.
