Aikakenttä
Kerää aikaa tarkasti ja helposti. Ajanvarauksesta työvuorojen valintaan tyylikkäillä natiiveilla aikavalitsimilla, älykkäillä aikaväleillä ja joustavalla muotoilulla – Aika-kenttä tarjoaa validoinnin, mukauttamisen ja saumattoman käyttökokemuksen.
Älykäs ajankeruu sisäänrakennetulla validointitoiminnolla
Täydellinen:
Tehokkaita ominaisuuksia jokaiseen käyttötarkoitukseen
🕐 Joustavat aikamuodot
24 tunnin tai 12 tunnin näyttö
Valitse yleisöllesi sopiva muoto. Käytä 24 tunnin sotilasaikaa (klo 14.30) kansainvälisille käyttäjille tai 12 tunnin AM/PM-aikaa (klo 14.30) tutumman käyttökokemuksen saavuttamiseksi.
Automaattinen muotoilumuunnos
Kenttä käsittelee formaatin muunnoksen automaattisesti – käyttäjät näkevät haluamansa formaatin, kun taas järjestelmäsi vastaanottaa yhdenmukaista dataa.
Esimerkkejä:
- Aukioloaika: 9.00–17.00 (12 tuntia)
- Kansainvälinen aikataulutus: 09:00 – 17:00 (24 tuntia vuorokaudessa)
- Lääkärinkäynnit: 14:30 (24 tunnin tarkkuudella)
⏰ Älykkäät aikavälit
Ohjauksen valinnan tarkkuus
Määritä, kuinka tarkkojen aikavalintojen tulisi olla. Valitse minuutin tai tunnin välein tarpeidesi mukaan.
Käytettävissä olevat aikavälit:
- Joka minuutti (12:00, 12:01, 12:02…) – Maksimaalinen tarkkuus
- 5 minuutin välein (klo 12.00, 12.05, 12.10…) – Normaali tapaaminen
- 10 minuutin välein (klo 12.00, 12.10, 12.20…) – Pikavaraukset
- 15 minuutin välein (klo 12.00, 12.15, 12.30…) – Yleisin
- 30 minuutin välein (klo 12.00, 12.30, 13.00…) – Puolen tunnin lähtöajat
- Joka tunti (klo 12.00, 13.00, 14.00…) – Yksinkertainen valinta
Miksi sillä on merkitystä:
Vähemmän vaihtoehtoja = nopeampi valinta. Sovita aikavälit aikataulutarpeisiisi paremman käyttökokemuksen saavuttamiseksi.
🎯 Aikavälin rajoitukset
Aseta aikaisimmat ja myöhäisimmät ajat
Rajoita käytettävissä olevia aikoja vastaamaan aukioloaikoja, tapahtuma-aikatauluja tai aukioloaikoja. Käyttäjät eivät voi valita aikoja määrittämäsi aikavälin ulkopuolelta.
Älykäs validointi
Selaintason validointi estää virheelliset lähetykset ennen kuin käyttäjät napsauttavat Lähetä-painiketta.
Käytä koteloita:
- Aukioloajat: Vain klo 9.00–18.00
- Iltatapahtumat: Vain klo 17.00 jälkeen
- Aamun aukioloajat: Vain ennen klo 12.00
- Yövuoro: klo 22.00–06.00
Esimerkkejä:
- Ravintolavaraukset: Min. 11:00, Max. 10:00
- Kuntosalitunnit: Min. 6:00, Max. 9:00
- Tukiajat: Min. 8:00, Max. 5:00
🔧 Oletusaika-asetukset
Kolme fiksua lähtöarvoa:
1. Tyhjä (ei oletusarvoa)
Käyttäjät aloittavat tyhjällä kentällä – paras vaihtoehto on silloin, kun aika on aina yksilöllinen.
2. Nykyinen aika
Täyttää automaattisesti nykyisen kellonajan lomakkeen latautuessa – täydellinen "tapahtuman aika"- tai aikaleimakenttiin.
3. Mukautettu aika
Valitse tietty aika, kuten ”9:00 AM”, ehdotettuja tapaamisaikoja tai yleisiä valintoja varten.
Milloin käyttää jokaista:
- Tyhjä – Tapahtuman alkamisajat, henkilökohtaiset aikataulut
- Nykyinen – Raportoi aikaleimat, sisäänkirjautumisajat
- Mukautettu – Ehdotetut kokousajat, oletusajat
⚡ Sekunnin tarkkuus (valinnainen)
Lisää sekunteja tarvittaessa
Ota käyttöön sekuntikenttä (HH:MM:SS) tarkkaa ajanseurantaa varten. Täydellinen aika-ajoihin, sekuntikelloihin ja tarkkoihin aikaleimoihin.
Muotoiluesimerkkejä:
- Ilman sekunteja: 14.30 tai 14.30
- Sekunneilla: 14:30:45 tai 2:30:45
Ihanteellinen:
- Urheilun ajoitus ja kilpailutulokset
- Tieteelliset kokeet
- Tarkat hakkuujärjestelmät
- Aika-ajojen lähettämiset
🔀 Ehdollinen logiikka
Dynaamiset aikakentät
Näytä tai piilota aikakenttä muiden lomakearvojen perusteella. Luo älykkäitä lomakkeita, jotka mukautuvat käyttäjän syötteeseen.
Edistyneet logiikan säännöt:
- JA-logiikka – Kaikkien ehtojen on täytyttävä
- TAI-logiikka – Mikä tahansa ehto voi laukaista toiminnon
- 8 operaattoria – Yhtä suuri kuin, Ei yhtä suuri kuin, Suurempi kuin, Pienempi kuin, Sisältää, On tyhjä ja paljon muuta
Käytä koteloita:
- Näytä ”Toivottu soittoaika” vain, kun ”Yhteydenotto puhelimitse” on valittuna
- Näytä ”Tapahtuman alkamisaika”, kun tapahtumatyyppi on ”Mukautettu tapahtuma”
- Piilota ”Toimitusaika”, kun toimitustapa on ”Vakiotoimitus”
- Näytä ”Kokousaika”, kun kokouksen tyyppi on ”Henkilökohtainen”
🎨 Parannettu käyttökokemus
Click-Anywhere-aktivointi
Napsauta mitä tahansa kentän kohtaa avataksesi alkuperäisen aikavalitsimen – suurempi kohdealue, parempi käytettävyys.
Natiivit aikavalitsimet
Käyttää selaimen sisäänrakennettua aikavalitsinta tutuilla, alustalle optimoiduilla käyttöliittymillä (iOS-pyörä, Android-kello, työpöydän alasvetovalikko).
Mobiili optimoitu
Kosketusystävällinen ajan valinta natiiveilla mobiilinäppäimistöillä ja valitsimilla.
Lisäominaisuudet:
- Mukautetut CSS-luokat tyylien luomiseen
- Järjestelmäaikojen piilotettu kenttätila
- Esteettömyystuki (ARIA-tunnisteet)
- Tyhjennä-painike helppoa nollausta varten
- Pakollinen kentän vahvistus
- Paikkamerkkitekstin tuki
Yksinkertainen asennus 3 vaiheessa
Valmistele aikakenttäsi muutamassa minuutissa
Lisää aikakenttä
Vedä ja pudota Aika-kenttä Peruskentät-osiosta lomakkeeseen.
Määritä muoto ja välit
Valitse 12 tunnin tai 24 tunnin muoto, aseta aikavälit (15 minuutin, 30 minuutin jne. välein) ja lisää halutessasi min/max-aikarajoituksia.
Aseta oletusaika
Valitse, alkaako kenttä tyhjänä, nykyisellä kellonajalla vai määrittämälläsi mukautetulla kellonajalla. Ota sekunnit käyttöön, jos tarvitset tarkkaa ajoitusta.
🎉 Siinä kaikki! Aikakenttäsi on valmis älykkään muotoilun ja validoinnin ansiosta.
Reaalimaailman sovellukset
Palvelu ja varaukset
* Ajoneuvojen huoltoajat
* Kiinteistön katseluaikataulut
* Matkavarausajat
* Tilojen varausajat
Kurssien ja aktiviteettien varaaminen
* Kuntoilutuntien ajat
* Harjoitusten aikataulutus
* Ryhmätoiminnan aikavälit
* Oppituntien aikatoiveet
Liiketoiminta
* Vuoron alkamis- ja päättymisajat
* Työaikataulujen lähettäminen
* Kokousaikojen koordinointi
* Saatavuusajan valinta
Ajanvaraus
* Lääkäriajan varaaminen
* Kauneushoitoloiden ja kylpylähoitoloiden varaukset
* Konsultaatioajan valinta
* Palveluajanvarauspyynnöt
Tapahtumaan ilmoittautuminen
* Tapahtuman alkamis- ja päättymisajat
* Istuntoajan asetukset
* Työpajojen aikataulut
* Konferenssiaikataulun valinta
Toimitus & Nouto
* Ruoan toimitusaikaikkunat
* Noutoajat myymälästä
* Noutoaikataulutus jalkakäytävältä
* Toimitusaika-asetukset
Täydelliset kenttäasetukset
Peruskokoonpano
- Kentän otsikko – Aikakentän yläpuolella näkyvä otsikko
- Kuvaus/ohjeteksti – Lisäohjeita käyttäjille
- Pakollinen kenttä – Tee ajan valinnasta pakollinen
- Paikkamerkkiteksti – Vihjeteksti ennen kuin käyttäjät valitsevat ajan
Aikamuotoasetukset
- Näytön muoto
- 24 tunnin kello (14:30)
- 12 tunnin kello AM/PM-formaatilla (klo 14.30)
Tarkkuus ja aikavälit
- Aikavälit
- Joka minuutti
- 5 minuutin välein
- 10 minuutin välein
- 15 minuutin välein (suosituin)
- 30 minuutin välein
- Joka tunti
Näytä sekunnit – Lisää sekuntikenttä tarkkaa aikaa varten (HH:MM:SS)
Aikarajoitukset
- Sallittu aikaisintaan (min) – Käyttäjät eivät voi valita aikoja ennen tätä
- Viimeisin sallittu aika (maksimi) – Käyttäjät eivät voi valita aikoja tämän jälkeen
Oletusarvot
- Aloitusajan valinta
- Ei ennalta valittua aikaa (tyhjä)
- Nykyinen aika (dynaaminen – latautuu, kun lomake avautuu)
- Mukautettu aika (asettamasi tietty aika)
Mukautettu aloitusaika – Valitse tietty aika esitäytölle (kun ”Mukautettu” on valittuna)
Ehdollinen logiikka
- Ota käyttöön ehdollinen logiikka – Näytä/piilota ehtojen perusteella
- Logiikkatyyppi
- Kaikkien ehtojen on täytyttävä (JA)
- Mikä tahansa ehto voi täyttyä (TAI)
- Ehtosäännöt
- Näytä/Piilota – Suoritettava toiminto
- Kenttä – Tarkistettava kenttä
- Operaattori – Yhtä suuri kuin, Ei yhtä suuri kuin, Sisältää, Suurempi kuin, Pienempi kuin, On tyhjä, Ei ole tyhjä
- Arvo – Vertailuarvo
- Useita ehtoja – Lisää rajattomasti sääntöjä
Lisäasetukset
- Piilotettu kenttätila – Käytä piilotettuna kenttänä ennalta asetetulla arvolla
- Mukautetut CSS-luokat – Käytä mukautettuja tyylejä
- Esteettömyysominaisuudet – ARIA-tunnisteet ja -kuvaukset
Miksi valita aikakenttämme?
✅ Intuitiivinen – Natiivit selainvalitsimet tarjoavat tutun käyttökokemuksen
✅ Joustava – 12 tai 24 tunnin muodot vastaavat käyttäjän mieltymyksiä
✅ Tarkka – Mukautettavat aikavälit minuutista tuntiin
✅ Älykäs – Min/Max-rajoitukset estävät virheelliset aikavalinnat
✅ Dynaaminen – Ehdollinen logiikka luo mukautuvia muotoja
✅ Käyttäjäystävällinen – Aktivointi missä tahansa, parempi käyttökokemus
✅ Mobiilioptimoitu – Kosketusystävälliset natiivit aikavalitsimet
✅ Täysin integroitu – Toimii saumattomasti kaikkien lomakeominaisuuksien kanssa
Usein Kysytyt Kysymykset
K: Mitä eroa on 12 tunnin ja 24 tunnin muodoilla?
12 tunnin muoto näyttää ajat AM/PM-muodossa, kuten 2:30 PM. 24 tunnin muoto käyttää aikoja, kuten 14:30, ja se on yleinen kansainvälisesti.
K: Miten aikavälit toimivat?
Aikavälit määrittävät aikavalintojen yksityiskohtaisuuden. Esimerkiksi 15 minuutin aikaväli näyttää kellonajat 9.00, 9.15, 9.30 ja niin edelleen.
K: Voinko rajoittaa ajat vain aukioloaikoihin?
Kyllä. Aseta aikaisin ja myöhäisin aika, kuten klo 9.00–17.00, ja käyttäjät voivat valita vain tältä väliltä.
K: Mitä oletusarvoinen ”Nykyinen aika” tarkoittaa?
Kun tämä on käytössä, kenttä täyttyy automaattisesti käyttäjän nykyisellä kellonajalla lomakkeen latauduttua.
K: Tarvitsenko sekuntikentän?
Yleensä ei. Ota se käyttöön vain, kun tarvitset tarkkaa ajoitusta, kuten HH:MM:SS-merkintöjä tapahtumille tai teknisille tiedoille.
K: Miten ajanvalitsin toimii mobiililaitteella?
Jokainen laite käyttää omaa käyttöliittymäänsä. iOS käyttää tyypillisesti rullavalitinta, kun taas Android käyttää kellotyylistä valitsinta.
K: Voinko käyttää ehdollista logiikkaa aikakenttien kanssa?
Kyllä. Voit näyttää tai piilottaa kenttiä valittujen aikojen perusteella käyttämällä ehtoja, kuten "Yhtä suuri kuin", "Suurempi kuin" tai "Pienempi kuin".
K: Mitä tapahtuu, jos käyttäjät yrittävät valita virheellisiä aikoja?
Sallitun alueen ulkopuoliset ajat estetään selaimen vahvistuksen perusteella, eikä niitä voi valita.
K: Voinko täyttää sen etukäteen tietyllä kellonajalla?
Kyllä. Valitse oletusajaksi ”Mukautettu” ja valitse mikä tahansa arvo, jonka haluat esiladattavan.
K: Toimiiko aikakenttä kaikissa selaimissa?
Kaikki nykyaikaiset selaimet tukevat HTML5-aikasyöttöjä sisäänrakennetuilla valitsimilla. Vanhemmat selaimet käyttävät tekstisyöttöä validoinnin kanssa.
K: Voinko muotoilla aikakentän vastaamaan sivustoani?
Kyllä. Valitsin käyttää natiivia käyttöliittymää, mutta syöttökentän muotoiluun voidaan käyttää CSS-luokkia.
K: Missä muodossa lähetetty aika on ilmoitettu?
Aika-arvot lähetetään aina 24 tunnin muodossa, mikä varmistaa tietojen yhdenmukaisuuden käsittelyä varten.
