Campo Data
Raccogli le date con precisione e controllo. Dalle prenotazioni di appuntamenti alle date di nascita con formattazione flessibile, restrizioni di intervallo di date e convalida intelligente, il campo Data offre ai selettori di calendario nativi potenti controlli per date passate, date future, fine settimana e intervalli personalizzati.
Raccolta dati professionale con convalida intelligente
Perfetto per:
Funzionalità potenti per ogni caso d'uso
📅 Quattro formati di data
Scegli le preferenze regionali:
Anno primo: 2023-12-31 (ISO 8601)
Formato standard internazionale. Ideale per database, ordinamento e applicazioni tecniche.
Primo mese: 31/12/2023 (stile USA)
Formato americano. Più familiare agli utenti statunitensi, con ordine mese-giorno-anno.
Primo giorno: 31/12/2023 (stile UK)
Formato britannico/europeo con ordine giorno-mese-anno. Comune a livello internazionale.
Primo giorno con trattini: 31-12-2023
Formato europeo alternativo che utilizza trattini al posto delle barre.
Perché il formato è importante:
Soddisfa le aspettative degli utenti in base alla regione
Previene confusione ed errori
Garantisce un'archiviazione coerente dei dati
Migliora i tassi di completamento dei moduli
Personalizzazione della visualizzazione:
Il formato influisce sul modo in cui le date vengono visualizzate dagli utenti, mantenendo al contempo il formato di archiviazione standard internamente.
📏 Restrizioni sull'intervallo di date
Controlla le date selezionabili:
Prima data consentita (minima):
Imposta la data minima selezionabile dagli utenti. Le date precedenti sono disabilitate nel selettore del calendario.
Esempi:
- Registrazione evento: Data minima = data di annuncio dell'evento
- Appuntamenti: Data minima = oggi (nessuna prenotazione passata)
- Dati storici: Data minima = data di fondazione dell'azienda
- Scadenze del progetto: Data minima = data di inizio del progetto
Ultima data consentita (massima):
Imposta la data massima selezionabile dagli utenti. Le date successive sono disabilitate nel selettore del calendario.
Esempi:
- Registrazione anticipata: Data massima = scadenza
- Disponibilità limitata: Data massima = ultima data disponibile
- Documenti storici: Data massima = oggi
- Periodo di tempo specifico: Data massima = fine della promozione
Pulsanti di impostazione rapida:
Imposta le date minime/massime fino a oggi con un clic oppure cancella le restrizioni all'istante.
⏮️ Blocca date passate
Impedisci la selezione di date precedenti:
Abilita "Blocca date passate" per disabilitare tutte le date precedenti a quella odierna. Gli utenti possono selezionare solo date odierne o future.
Ideale per:
- Prenotazioni di appuntamenti (nessun appuntamento passato)
- Registrazione all'evento (solo per i prossimi eventi)
- Selezione della data di consegna (consegne future)
- Sistemi di prenotazione (prenotazioni anticipate)
- Scadenze (devono essere future)
Comportamento intelligente:
Aggiornamenti automatici giornalieri: la data odierna è sempre valida, quella di ieri viene disabilitata. Non è necessaria alcuna gestione manuale delle date.
Si combina con altre restrizioni:
Utilizzare con la data massima per creare finestre temporali future (ad esempio, prenotazioni da oggi fino a 30 giorni dopo).
⏭️ Blocca date future
Impedisci la selezione delle date imminenti:
Abilita "Blocca date future" per disabilitare tutte le date successive a oggi. Gli utenti possono selezionare solo date odierne o passate.
Ideale per:
- Raccolta di date di nascita (non possono essere future)
- Date degli eventi storici (solo passati)
- Date di inizio dell'esperienza (quando hai iniziato?)
- Date di completamento (già avvenute)
- Date di anniversario (eventi passati)
Utilizzo nel mondo reale:
Garantisce l'inserimento logico delle date: le date di nascita, di assunzione e di laurea devono essere nel passato.
Convalida integrata:
Il browser impedisce automaticamente le selezioni non valide. Non sono necessari messaggi di errore confusi.
📆 Disattiva i fine settimana
Selezione del blocco sabato e domenica:
Abilita "Nessuna selezione weekend" per disabilitare sabato e domenica nel selettore del calendario. È possibile selezionare solo i giorni feriali (dal lunedì al venerdì).
Ideale per:
- Prenotazioni di appuntamenti aziendali
- Pianificazione delle consegne in ufficio
- Selezione della data della consultazione
- Appuntamenti di servizio (solo dal lunedì al venerdì)
- Pianificazione di riunioni B2B
Interazioni intelligenti:
Se l'utente seleziona in qualche modo un fine settimana (tramite tastiera), il sistema corregge automaticamente il fine settimana al lunedì successivo. Protezione impeccabile.
Combinabile con altre opzioni:
Funziona con restrizioni passate/future: sono selezionabili solo i giorni feriali compresi nell'intervallo consentito.
🎯 Opzioni data predefinite
Date di inizio preselezionate:
Nessuna data preselezionata (vuoto):
Il campo è vuoto all'inizio. Gli utenti devono selezionare attivamente una data. Ideale per date che variano notevolmente.
Data odierna:
Precompila automaticamente con la data corrente al caricamento del modulo. Aggiornamenti dinamici ogni giorno.
Casi d'uso:
- Campi “Data della richiesta”
- Moduli di marcatura temporale
- Documentazione della data corrente
- Selezioni del programma di oggi
Data di domani:
Precompila automaticamente la data di domani. Perfetto per le prenotazioni per il giorno successivo.
Casi d'uso:
- Selezione di consegna il giorno successivo
- Prenotazioni degli appuntamenti di domani
- Predefiniti degli eventi futuri
- Disponibilità il giorno successivo
Data specifica personalizzata:
Scegli una data fissa da preselezionare. Ideale per date suggerite o moduli specifici per un evento.
Casi d'uso:
- Data dell'appuntamento consigliata
- Date predefinite dell'evento
- Suggerimenti per le scadenze
- Date di domanda precompilate
📱 Selettore calendario nativo
Selezione della data ottimizzata per il browser:
Utilizza input di date nativi HTML5 con il selettore di calendario integrato nel browser. Offre un'esperienza familiare e specifica per ogni piattaforma.
Aspetto specifico della piattaforma:
- iOS: Bellissimo selettore a rotella
- Android: calendario Material Design
- Desktop Chrome: Calendario a discesa
- Safari desktop: selettore compatto
- Tutto ottimizzato per la loro piattaforma
Vantaggi:
- Nessuna libreria JavaScript necessaria
- Caricamento istantaneo
- Accessibile per impostazione predefinita
- Tastiera navigabile
- Ottimizzato per il tocco
- Dimensione minima del file
Clicca ovunque:
L'intero campo è cliccabile per aprire il calendario. L'ampia area di interazione migliora l'usabilità.
✅ Convalida intelligente della data
Livelli di convalida integrati:
Convalida del formato:
Il browser assicura automaticamente il corretto formato della data. Gli utenti non possono inserire date non valide come "2023-13-45".
Validazione dell'intervallo:
Date minime/massime applicate a livello di selettore. Le date non valide sono disabilitate e non possono essere selezionate.
Validazione logica:
Le restrizioni passate/future/del fine settimana vengono applicate automaticamente. Il sistema impedisce selezioni non valide.
Cancella i messaggi di errore:
Se gli utenti in qualche modo aggirano le restrizioni, vengono visualizzati messaggi chiari che spiegano: "La data deve essere successiva al 01/01/2024" oppure "La data deve essere precedente al 31/12/2024".
🔀 Logica condizionale
Visibilità del campo data dinamico:
Mostra o nascondi i campi data in base ad altri valori del modulo. Visualizza i campi data rilevanti solo quando necessario.
Regole logiche avanzate:
- Logica AND: tutte le condizioni devono essere soddisfatte
- Logica OR: qualsiasi condizione può attivare l'azione
- 8 operatori: uguale, diverso, maggiore, minore, contiene, è vuoto e altro ancora
Casi d'uso:
- Mostra "Data preferita" solo quando il tipo di prenotazione è uguale a "Appuntamento"
- Visualizza "Data evento" quando il tipo di evento non è vuoto
- Mostra "Data di consegna" quando il metodo di spedizione è uguale a "Programmato"
- Nascondi "Data di ritorno" quando il tipo di biglietto è "Solo andata"
🎯 Esperienza utente migliorata
Funzionalità intelligenti integrate:
- Visualizzazione della data: la data selezionata viene visualizzata in un formato leggibile
- Icona del calendario: indicatore visivo del selettore della data
- Navigazione tramite tastiera: i tasti freccia consentono di navigare nel calendario
- Accessibilità tramite scheda: supporto completo della tastiera
- Ottimizzato al tocco: grandi target touch su dispositivi mobili
- Correzione automatica: le date non valide vengono automaticamente adattate alla data valida più vicina
- Evidenziazione odierna: data corrente evidenziata nel selettore
- Selezione rapida: fare clic sulla data e il selettore si chiude automaticamente
- Supporto testo di aiuto: aggiungi suggerimenti o istruzioni sul formato della data
- Convalida richiesta: rendere obbligatoria la selezione della data
- Classi CSS personalizzate: applica stili personalizzati
- Supporto per l'accessibilità: etichette ARIA, compatibili con i lettori di schermo
Configurazione semplice in 3 passaggi
Prepara il tuo campo data in pochi minuti
Aggiungi campo data
Trascina e rilascia il campo Data dalla sezione Campi di base nel tuo modulo.
Scegli formato e intervallo
Seleziona il formato della data (USA, Regno Unito, ISO), imposta facoltativamente i limiti della data minima/massima e abilita il blocco passato/futuro/fine settimana secondo necessità.
Imposta data predefinita
Scegli se il campo deve iniziare vuoto, precompilare con oggi, domani o una data personalizzata da te specificata.
."🎉 Ecco fatto! Il tuo campo data è pronto con convalida intelligente e selettori nativi.
Applicazioni del mondo reale
Prenotazione appuntamenti
* Date degli appuntamenti medici
* Pianificazione della consultazione
* Selezione dell'appuntamento per il servizio
* Coordinamento data incontro
Evento di registrazione
* Date di partecipazione all'evento
* Selezione della data del workshop
* Registrazione alla conferenza
* Date di iscrizione ai corsi
Consegna e Spedizione
* Date di consegna preferite
* Selezione della data di spedizione
* Pianificazione della data di ritiro
* Pianificazione della data di spedizione
Applicazioni aziendali
* Date di scadenza del progetto
* Date di scadenza delle attività
* Date di decorrenza del contratto
* Date di inizio/fine dell'accordo
Informazioni personali
* Raccolta delle date di nascita
* Date di anniversario
* Data di inizio dell'impiego
* Date di completamento dell'istruzione
Prenotazioni
* Date di check-in in hotel
* Date di inizio del noleggio
* Date di conferma della prenotazione
* Selezione del periodo di prenotazione
Completa le opzioni del campo
Configurazione di base
- Etichetta del campo: il titolo mostrato sopra il campo data
- Descrizione/Testo di aiuto – Ulteriori indicazioni per gli utenti
- Campo obbligatorio: rende obbligatoria la selezione della data
- Segnaposto: non applicabile per i selettori di data nativi
Formato data
- Come visualizzare le date:
- Anno primo: 2023-12-31 (ISO 8601)
- Primo mese: 31/12/2023 (stile USA)
- Primo giorno: 31/12/2023 (stile Regno Unito)
- Primo giorno con trattini: 31-12-2023
Restrizioni dell'intervallo di date
- Prima data consentita: la data più antica che gli utenti possono selezionare (lasciare vuoto per non avere limiti)
- Ultima data consentita: ultima data selezionabile dagli utenti (lasciare vuoto per non avere limiti)
Opzioni di blocco della data
- Blocca date passate: impedisce di selezionare date precedenti a oggi
- Blocca date future: impedisce di selezionare date successive a oggi
- Nessuna selezione del fine settimana: impedisce la selezione di sabato e domenica
Selezione della data di inizio:
- Nessuna data preselezionata (vuota) – Il campo inizia vuoto
- Data odierna – Data corrente precompilata
- Data di domani - Precompilato il giorno successivo
- Data specifica (a tua scelta) – Data personalizzata precompilata
Data predefinita personalizzata: seleziona la data di inizio (visualizzata quando è selezionata l'opzione "Data specifica")
Logica condizionale
- Abilita logica condizionale: mostra/nascondi in base alle condizioni
- Tipo logico
- Tutte le condizioni devono essere soddisfatte (E)
- Qualsiasi condizione può essere soddisfatta (OR)
- Regole di condizione
- Mostra/Nascondi – Azione da intraprendere
- Campo – Quale campo controllare
- Operatore – Uguale, Non uguale, Contiene, Maggiore di, Minore di, È vuoto, Non è vuoto
- Valore – Valore di confronto
- Condizioni multiple: aggiungi regole illimitate
Opzioni avanzate
- Campo nascosto: rende il campo invisibile ma include la data negli invii
- Classi CSS personalizzate: applica stili personalizzati
- Attributi di accessibilità: etichette ARIA per lettori di schermo
Perché scegliere il nostro campo data?
✅ Formati multipli: formati USA, UK, ISO e tratteggiati
✅ Controllo dell'intervallo di date: imposta con precisione i limiti minimo/massimo
✅ Blocca date passate: consenti solo selezioni di date future
✅ Blocca date future: consenti solo selezioni di date passate
✅ Disattiva fine settimana: selezione solo per i giorni feriali per le aziende
✅ Impostazioni predefinite intelligenti: precompila con la data odierna, quella di domani o una data personalizzata
✅ Native Pickers: calendari ottimizzati per browser per ogni piattaforma
✅ Convalida automatica: non è possibile selezionare date non valide
✅ Completamente integrato: funziona perfettamente con tutte le funzionalità del modulo
Domande frequenti
D: Quali formati di data sono supportati?
Quattro formati: ISO (31/12/2023), USA (31/12/2023), UK (31/12/2023) e Tratteggiato (31/12/2023). Scegli il formato più adatto al tuo pubblico.
D: Come posso impedire agli utenti di selezionare date passate?
Abilita "Blocca date passate". Qualsiasi data precedente a quella odierna non sarà più selezionabile nel selettore data.
D: Posso limitare le date a un intervallo specifico?
Sì. Imposta "Prima data consentita" e "Ultima data consentita" per limitare le scelte a una finestra definita.
D: Cosa fa "Disabilita i fine settimana"?
Rimuove la possibilità di selezionare sabato e domenica. Rimangono disponibili solo i giorni dal lunedì al venerdì.
D: Come funzionano le date predefinite?
Scegli se il campo inizia vuoto, mostra la data odierna, quella di domani o una data personalizzata. Oggi e domani si adattano automaticamente.
D: Il selettore della data ha lo stesso aspetto su tutti i dispositivi?
No. Utilizza l'interfaccia utente nativa di ciascun dispositivo: selettori a rotella iOS, calendari Android, selettori desktop e così via.
D: Posso bloccare date future per i campi data di nascita?
Sì. Attiva "Blocca date future" in modo che gli utenti possano scegliere solo date fino a oggi incluso.
D: Come funzionano le date min/max insieme al blocco passato/futuro?
Si accumulano. Ad esempio, bloccando date passate più una data massima di 30 giorni in avanti, si ottiene un intervallo da oggi a 30 giorni.
D: Gli utenti possono digitare le date invece di usare il selettore?
Alcuni browser consentono la digitazione con convalida. Altri forzano il selettore della data. Tutti impongono la formattazione corretta.
D: Cosa succede se un utente seleziona un fine settimana quando i fine settimana sono disabilitati?
Il sistema si adatta automaticamente al giorno feriale valido più vicino, in genere il lunedì successivo.
D: Posso usare la logica condizionale con i campi data?
Sì. Utilizza confronti come "Uguale a", "È vuoto", "Non è vuoto", "Maggiore di" o "Minore di" per controllare la visibilità di altri campi.
D: Come faccio a impostare una data di scadenza?
Inserisci la scadenza in "Ultima data consentita". Gli utenti non potranno selezionare date successive a tale data. Combina questa opzione con "Blocca date passate" se hai bisogno di disponibilità solo per il futuro.
