Riepilogo AI
Volete limitare le opzioni temporali disponibili nel vostro campo Data/Ora per date specifiche? Per impostazione predefinita, il campo Data/Ora di WPForms consente di impostare intervalli di tempo generali utilizzando le impostazioni del costruttore del modulo. Tuttavia, se avete bisogno di imporre limiti di tempo speciali per una data particolare (ad esempio, orari di prelievo più brevi in un giorno festivo), potete farlo facilmente utilizzando un piccolo snippet JavaScript.
In questa esercitazione vi illustreremo i passaggi per limitare l'intervallo di tempo disponibile per una data specifica, mantenendo i limiti di tempo generali per tutte le altre date.
Creazione del modulo
Per prima cosa, è necessario creare il modulo e aggiungere il campo Data/ora.
Se si desidera che gli utenti selezionino separatamente la data e l'ora, assicurarsi che il tipo di campo sia impostato su Data/ora in Formato.
Ad esempio:
- Orario di ritiro generale: dalle 11:00 alle 17:00.
- Giornata speciale (4 ottobre 2025): Dalle 11:00 alle 14:00
Aggiunta di limiti di tempo condizionati
Ora è il momento di aggiungere lo snippet al vostro sito.
Se non sapete dove o come aggiungere gli snippet di codice, consultate il nostro tutorial sull'aggiunta di PHP o JavaScript personalizzati per WPForms.
add_action('wpforms_wp_footer_end',function(){?>
<script type="text/javascript">
jQuery(document).ready(function($){
var formID=815; // WPForms form ID
var fieldID=12; // WPForms field ID (Date/Time)
var dateField=$('#wpforms-'+formID+'-field_'+fieldID);
var timeField=$('#wpforms-'+formID+'-field_'+fieldID+'-time');
function updateTimeLimits(){
var selectedDate=dateField.val();
if(!selectedDate)return;
var parts=selectedDate.split('/');
var day=parseInt(parts[0],10);
var month=parseInt(parts[1],10);
var year=parseInt(parts[2],10);
var minTime='11:00';
var maxTime='17:00';
if(month===10&&day===4){maxTime='14:00';}
var today=new Date();
var selected=new Date(year,month-1,day);
if(today.toDateString()===selected.toDateString()){
var nowH=today.getHours();
var nowM=today.getMinutes();
if(nowM>0){nowH++;nowM=0;}
var currentMin=(nowH<10?'0':'')+nowH+':00';
if(currentMin>minTime){minTime=currentMin;}
}
timeField.timepicker('option',{minTime:minTime,maxTime:maxTime});
}
dateField.on('change',updateTimeLimits);
updateTimeLimits();
});
</script>
<?php},10);
Questo snippet controlla la data selezionata e regola di conseguenza gli orari disponibili.
Nell'esempio precedente:
- Ogni giorno è possibile selezionare l'orario dalle 11:00 alle 17:00.
- Il 4 ottobre 2025, il raggio d'azione è ridotto alle 11:00 alle 14:00.
Assicurarsi di sostituirlo:
815con l'ID del modulo.12con l'ID del campo Data/Ora
Se non siete sicuri di come trovarli, consultate la nostra guida su come individuare l'ID del modulo e l'ID del campo.
Ed ecco fatto! Avete impostato con successo i limiti di tempo condizionali per una data specifica nel vostro campo Data/Ora di WPForms.
Volete anche bloccare completamente alcuni intervalli di date? Consultate il nostro tutorial su come personalizzare le opzioni di data del campo Data/Ora.