Creați o intrare minimală a intrărilor de date Selectați cu ajutorul planului plat
Unul dintre cele mai trucate câmpuri de creat este selectați data / ora. Dezvoltatorii folosesc adesea meniuri simple selectate pentru luna / zi / an sau se bazează pe diverse plugin-uri pentru a-și face treaba.
Selectarea câmpurilor funcționează bine, dar ele sunt puțin ciudate. În schimb, puteți să vă formalizați formularul cu Flatpickr plugin. E o gratuit, selectorul de calendar JavaScript open-source cu dependențe zero.
A fost concepute cu minimalism în minte, astfel încât să se potrivească în orice aspect web, orice formular web și ar trebui să fie utilizabil de la orice dispozitiv modern.
Un lucru frumos despre acest plugin este varietate de opțiuni personalizate. Puteți restabili modul în care datele apar în câmpul de text și unde începe calendarul (implicite “astăzi”).
Dar, puteți, de asemenea utilizați-l ca fiind un selector de date strict dacă nu aveți nevoie de selectarea timpului. Este doar o caracteristică opțională care vă permite să transmiteți mai multe date prin intermediul acestui formular.
Uitați-vă la Exemple de pagini pentru a vedea Flatpickr în acțiune.
Poti de asemenea setați opțiunile vizate pentru a limita comportamentul selectatorului de date, cum ar fi:
- Încălcarea anumitor date / intervale
- Numai permiterea anumitor date / intervale
- Permiteți selectarea mai multor date
- “Modul de distanță” pentru a selecta o dată de început și de sfârșit
- Doar un selector de date, sau doar timpul, sau ambele data și ora împreună
Opțiunile sunt practic nesfârșite și toate lucrează prin acest plugin vanilla JavaScript.
Utilizatorii de mobile preferă adesea selectorul de date nativ, dar puteți înlocuiți acest lucru cu o setare mobilă în JavaScript. În acest fel, veți avea aceeași interfață care să funcționeze pe toate dispozitivele.
Și, puteți chiar adăugați suport pentru IE9 cu un filtru de tip polyfill ceea ce face ca acesta să fie unul dintre cele mai bine acceptate pluginuri de selectare a datei acolo.
Instalarea este simplă cu comenzi pentru npm, Bower și Fire. Sau puteți descărca fișierele sursă direct de la GitHub dacă preferați acel traseu.
Tot ce trebuie să știți poate fi găsit pe pagina de configurare care vă arată cum să adăugați fișierele în antetul dvs. & cum se poate apela acest selector de date pe orice câmp. Ușor unul dintre cele mai bune plugin-uri de selectare a datei concepute suficient pentru a se potrivi cu orice design.