În acest tutorial îți voi arăta cum poți implementa introducerea datei și orei în formularele tale web. Voi explica diferitele tipuri de introducere disponibile și îți voi oferi sfaturi valoroase pentru aplicarea practică. Vom discuta atât introducerea datei cât și a orei, astfel încât să dobândești o înțelegere solidă a implementării acestor funcții.
Cele mai importante concluzii
- Tipul de introducere date permite selectarea unei singure date.
- Tipul de introducere dateTime-local combină data și ora fără ajustare a fusului orar.
- Formatarea datelor și orelor este standardizată conform ISO 8601.
- Browserele pot avea diferențe în modul în care afișează introducerea de date și ore.
Principii de bază ale introducerii datei și orei
Pentru a implementa introducerea datei și orei în formularele tale, ai nevoie de tipurile de introducere HTML date, dateTime-local și time. Tipul date îți permite utilizatorului să selecteze o dată, în timp ce tipul dateTime-local capturează atât data cât și ora. Acesta din urmă se trimite fără ajustare a fusului orar, ceea ce înseamnă că introducerea se transmite către server așa cum a fost efectuată de către utilizator.
Acum ne uităm la aceste tipuri în detaliu.
Utilizarea tipului de introducere date
Pentru a interoga o dată simplă, poți folosi tipul date. Acest lucru permite utilizatorului să selecteze o dată folosind un instrument încorporat de calendar, ceea ce îmbunătățește ușurința de utilizare.
Când deschizi instrumentul de calendar, poți selecta diverse date și le poți transmite făcând clic pe „Trimite“. În acest sens, data este transmisă într-un format standardizat: An-Lună-Zi.
Este important de știut că afișarea calendarului poate fi diferită în funcție de browser. Setările regionale ale sistemului tău de operare influențează modul în care data este afișată.
Introducerea datei și orei cu dateTime-local
Dacă dorești să capturezi atât data cât și ora, ar trebui să folosești tipul dateTime-local. Acesta funcționează la fel ca interogarea datei, cu mențiunea că poți specifica și o oră suplimentară.
Aici poți selecta atât ziua cât și ora. În mod interesant, timpul este afișat în format de 24 de ore, în cazul în care nu este activat formatul AM/PM în setările tale locale.
Când trimiți formularul, datele sunt de asemenea transmise în format ISO, iar ora rămâne neschimbată, fără a fi convertită în alt fus orar.
Utilizarea tipului de introduce time
Tipul de introducere time îți permite să specifici doar ora fără dată. Prin acest tip, ai posibilitatea să selectezi ora, care va fi de asemenea transmisă în format de 24 de ore.
Integrarea altor formate de dată
Pe lângă tipurile menționate mai sus, există posibilitatea de a implementa input-uri pentru Săptămâni (week) și Luni (month). Cu ajutorul formatului week, poți specifica anumite săptămâni și să selectezi ușor săptămâna dorită.
Pentru formatul month se aplică lucruri similare. Aici ai posibilitatea să selectezi doar luna, fără a specifica zile specifice.
Setări predefinite și valori
Un alt sfat util este posibilitatea de a seta valori implicite pentru câmpurile tale de introducere. Astfel poți stabili, de exemplu, că la selectarea datei și orei, o anumită dată este preconfigurată implicit.
Fusurile orare și compatibilitatea cu browserul
Un aspect central în utilizarea datelor și orelor este fusul orar. Intrările sunt salvate exact așa cum sunt introduse local. Adaptările fusului orar nu sunt necesare în acest context, astfel încât să poți transmite direct ora locală.
Cu toate acestea, este important de menționat că suportul pentru aceste tipuri de intrări poate varia în funcție de browser. În timp ce date și dateTime-local sunt acceptate de aproape toți browserii cunoscuți, este recomandat să te consulți pe site-uri precum "Can I use" pentru a verifica dacă funcțiile specifice funcționează și în browserele publicului tău.
Rezumat
În concluzie, acum ai o vedere de ansamblu asupra implementării datelor și orelor în formularele web. Cunoști diferitele tipuri de intrări, formatele acestora și importanța setărilor utilizatorului. Atingerea unei formate corecte și a susținerii browserului sunt esențiale pentru a crea o experiență fluidă pentru utilizatorii tăi.
Întrebări frecvente
Care este diferența dintre date și dateTime-local?date permite doar selectarea unei date, în timp ce dateTime-local permite atât data, cât și ora.
Cum este tratat fusul orar în cazul dateTime-local?Ora este transmisă așa cum a fost introdusă local, fără ajustări de fus orar.
Ce browsere susțin aceste tipuri de intrare?Cele mai multe browsere cunoscute susțin date și dateTime-local; pentru funcțiile specifice, poți consulta "Can I use".
Pot seta preferințe predefinite pentru câmpurile de dată?Da, poți seta preferințe predefinite pentru câmpurile de intrare folosind atributul value.
Ce formate sunt utilizate în transmitere?Datele sunt transmise în formatul ISO (An-Lună-Zi pentru dată, An-Lună-Zi T Ore:Minute:Secunde pentru dată și oră).
