Homepage » Web Design » Minimalista adatbeviteli bemenet létrehozása Válasszon a Flatpickr segítségével

    Minimalista adatbeviteli bemenet létrehozása Válasszon a Flatpickr segítségével

    Az egyik legnehezebb mező a létrehozása dátum / idő kiválasztása. A fejlesztők gyakran egyszerű menüket választanak a hónap / nap / évre, vagy különböző pluginekre támaszkodnak a feladat elvégzéséhez.

    A kiválasztott mezők jól működnek, de kicsit bosszantóak. Ehelyett az űrlapot jazz fel a Flatpickr plugin. Ez egy ingyenes, nyílt forráskódú JavaScript naptárgyűjtő nulla függőségekkel.

    Ez volt a minimalizmus szem előtt tartásával készült, így beleilleszkedhet bármely weboldal elrendezésébe, bármilyen webes formába, és bármilyen modern eszközből használható.

    Egy szép dolog ez a plugin a különböző egyéni beállítások. A dátumokat a szövegmezőben megjelenítheti, és a naptár elindul (alapértelmezés szerint be van kapcsolva) “Ma”).

    De te is használjon olyan szigorúan egy dátumválasztót ha nincs szüksége az idő kiválasztására. Ez csak egy opcionális funkció, amely lehetővé teszi, hogy több adatot továbbítson a formanyomtatványon keresztül.

    Vessen egy pillantást a Példák oldal látni Flatpickr-t akcióban.

    Te is célzott opciók beállítása a dátumválasztó viselkedésének korlátozása, például:

    • Bizonyos dátumok / tartományok letiltása
    • Csak bizonyos dátumok / tartományok engedélyezése
    • Több dátumválasztás engedélyezése
    • “Tartomány mód” a kezdési és befejezési dátum kiválasztásához
    • Csak egy dátumválasztó, vagy csak az idő vagy a dátum és az idő együtt

    A lehetőségek gyakorlatilag végtelenek, és mindezek a vanilla JavaScript pluginok.

    A mobil felhasználók gyakran inkább a natív dátumválasztót választják, de lehet felülírja ezt egy mobil beállítással a JavaScript-ben. Így ugyanaz az interfész működik minden eszközön.

    És még Add hozzá az IE9 támogatást egy polifillal ez teszi ezt az egyik leginkább támogatott dátumválasztó bővítményt.

    A telepítés egyszerű npm, Bower és Yarn parancsok. Vagy letöltheti a forrásfájlokat közvetlenül a GitHub-tól ha ezt az utat szeretné.

    Minden, amit tudnod kell, megtalálható a beállítási oldalon, amely megmutatja hogyan lehet hozzáadni a fájlokat a fejlécéhez & hogyan hívhatja ezt a dátumválasztót bármelyik területen. Egyszerűen az egyik legjobb dátumválasztó plugin, amelyet egyszerűen csak úgy terveztek, hogy illeszkedjenek a designhoz.