Support » Plugin: Contact Form 7 Datepicker » Date Offset on Display

  • Hi all,

    Does anyone know what I would need to do to make the datepicker calendar have an offset of 14 days as the service that is being associated with the datepicker needs to have a 14 day period in which people are unable to select an appointment?

    Basically what I would like to be able to achieve is that when the user clicks on the calendar it would have a two week period that is unavailable for selection and default to a date 14 days from when they click it with the remaining days available?

    I guess that this would be a simple change but i can’t seem to figure it out?

    Your help is much appreciated.

    Thanks

Viewing 4 replies - 1 through 4 (of 4 total)
  • Maybe it will help you:

    <script>
            jQuery(function ($) {
                if ($('.inicio_recoleccion input') != null && $('.fin_recoleccion input') != null) {
                    var start = $('.inicio_recoleccion input').first();
                    var end = $('.fin_recoleccion input').first();
    
                    
                    //Se calcula para el inicio
                    start.on('change', function () {
                        //Estas lineas impiden que la fecha de fin sea anterior a la fecha inicio
                        var start_date = $(this).datepicker('getDate');
                        start_date.setDate(start_date.getDate());
                        end.datepicker('option', 'minDate', start_date);
    
                        // Calcula la semana
                        var semana_inicio = $(this).datepicker('getDate');
                        $(id_inicio_recoleccion).val($.datepicker.iso8601Week(new Date(semana_inicio)));
    
                    });
    
                    //Se calcula para el fin
                    end.on('change', function () {
                        var semana_fin = $(this).datepicker('getDate');
                        $(id_fin_recoleccion).val($.datepicker.iso8601Week(new Date(semana_fin)));
    
                    });
    
                }
    
            });
        </script>

    Thanks for your reply!

    So would this implement like this?

    <script>
            jQuery(function ($) {
                if ($('.inicio_recoleccion input') != null && $('.fin_recoleccion input') != null) {
                    var start = $('.inicio_recoleccion input').first();
                    var end = $('.fin_recoleccion input').first();
    
                    
                    //Se calcula para el inicio
                    start.on('change', function () {
                        //Estas lineas impiden que la fecha de fin sea anterior a la fecha inicio
                        var start_date = $(this).datepicker('getDate');
                        start_date.setDate(start_date.getDate());
                        end.datepicker('option', 'minDate', start_date);
    
                        // Calcula la semana
                        var semana_inicio = $(this).datepicker('getDate');
                        $(id_inicio_recoleccion).val($.datepicker.iso8601Week(new Date(semana_inicio)));
    
                    });
    
                    //Se calcula para el fin
                    end.on('change', function () {
                        var semana_fin = $(this).datepicker('getDate');
                        $(id_fin_recoleccion).val($.datepicker.iso8601Week(new Date(semana_fin)));
    
                    });
    
                }
    
            });
        </script>
    <div>
    [text* your-name placeholder "Full Name"] 
    [tel tel-44 class:telnum placeholder "Telephone number"]
    [email* your-email placeholder "Email Address"] 
    [text* your-pre class:calendar placeholder "Preferred date" ]
    <div class="timebox"><strong>Time of day </strong>[radio time class:time "AM" "PM"]</div>
    [submit "Send"]
    </div>

    Any help would be appreciated

    This function detects a start date and prevents that the end date is earlier.
    Maybe you can adapt he code for your functionality into functions.php from your theme.

    Thanks, I will see what i can make from it.

    Again, thanks for taking the time to help 🙂

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Date Offset on Display’ is closed to new replies.