Definição de limites de tempo condicionais para datas específicas num campo de data/hora

Gostaria de limitar as opções de tempo disponíveis no seu campo Data/Hora para datas específicas? Por padrão, o campo Data/Hora no WPForms permite que você defina intervalos de tempo gerais usando as configurações do construtor de formulários. No entanto, se precisar de impor limites de tempo especiais para uma data específica (por exemplo, horas de recolha mais curtas num feriado), pode fazê-lo facilmente usando um pequeno snippet JavaScript.

Neste tutorial, vamos guiá-lo através dos passos para restringir o intervalo de tempo disponível para uma data específica, mantendo os limites de tempo gerais para todas as outras datas.

Criar o formulário

Primeiro, tem de criar o formulário e adicionar o campo Data/Hora.
Se pretender que os utilizadores seleccionem a data e a hora separadamente, certifique-se de que o tipo de campo está definido para Data/Hora em Formato.

Por exemplo:

• Horário geral de recolha: das 11:00 às 17:00
• Dia especial (4 de outubro de 2025): 11:00 AM a 2:00 PM

Adição de limites de tempo condicionais

Agora é hora de adicionar o snippet ao seu site.
Se você não tem certeza de onde ou como adicionar trechos de código, consulte nosso tutorial sobre como adicionar PHP ou JavaScript personalizado para 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);

Este snippet verifica a data selecionada e ajusta os horários disponíveis em conformidade.
No exemplo acima:

• Todos os dias é possível selecionar o horário das 11:00 às 17:00 horas.
• Em 4 de outubro de 2025, o intervalo é reduzido para as 11:00 às 14:00 horas.

Certifique-se de que substitui:

• 815 com o seu ID de formulário.
• 12 com o seu ID do campo Data/Hora

Se não tiver a certeza de como os encontrar, consulte o nosso guia sobre como localizar o ID do formulário e o ID do campo.

E é isso! Você definiu com sucesso limites de tempo condicionais para uma data específica no seu campo Data/Hora do WPForms.

Também gostaria de bloquear completamente determinados intervalos de datas? Consulte o nosso tutorial sobre como personalizar as opções de data do campo Data/Hora.