Question 41680 in PHP Question posted in
Official manual can be found here.

How to assign the same value to the end_date field as is selected in the star_date field – PHP

I would like the user to be able to select the start_date and automatically (without the user selecting anything) have the same value appear in the end date. Here is the code snippet I have extracted:

                <?php
                $required         = 'false';
                $start_date_value = '';

                if ( 'yes' == $settings['cwbf_start_date_required'] ) {
                    $required = 'true';
                }

                if ( isset( $_GET['start_date'] ) ) {
                    $start_date_value = sanitize_text_field( wp_unslash( $_GET['start_date'] ) );
                }
                $start_place_holder = __( 'Día de la reserva', 'codup-filters-for-woo-booking' );
                ?>
                <input name="start_date" id="start_date" validate-required="<?php echo wp_kses_post( $required ); ?>" placeholder="<?php echo wp_kses_post( $start_place_holder ); ?>" autocomplete="off" min="<?php echo wp_kses_post( gmdate( 'Y-m-d' ) ); ?>" type="text"  value="<?php echo wp_kses_post( $start_date_value ); ?>" />
            </div>
            <?php
            if ( 'yes' == $settings['cwbf_end_date_enable'] ) {
                ?>
                <div class="filter-row">
                    <label class="cwbf-fields-label">
                <?php
                if ( '' != $settings['cwbf_end_date_text'] ) {
                    echo wp_kses_post( $settings['cwbf_end_date_text'] );
                } else {
                    esc_attr_e( 'End Date', 'codup-filters-for-woo-booking' );
                }
                ?>
                    </label>

                <?php
                $required       = 'false';
                $end_date_value = '';

                if ( 'yes' == $settings['cwbf_end_date_required'] ) {
                    $required = 'true';
                }

                if ( isset( $_GET['end_date'] ) ) {
                    $end_date_value = sanitize_text_field( wp_unslash( $_GET['end_date'] ) );
                }
                $end_place_holder = __( 'Place your End Date here', 'codup-filters-for-woo-booking' );
                ?>
                <input name="end_date" id="end_date" validate-required="<?php echo wp_kses_post( $required ); ?>" placeholder="<?php echo wp_kses_post( $end_place_holder ); ?>" autocomplete="off" min="<?php echo wp_kses_post( gmdate( 'Y-m-d' ) ); ?>" type="text"  value="<?php echo wp_kses_post( $end_date_value ); ?>" />
                </div>
                <?php

I am a newbie in html and php but I think this is a critical issue for my project, thank you very much 🙂

Tags:

2

Answers


  1. 0

    If you use jquery:

    $('#start_date').on('change', function(){
    $('#end_date').val($(this).val())
})

    I did not test it in a real environment but I guess it should work without any bugs.

    Edit: as @Martin mentioned:

    1. Add jquery to your page. You can use this link to add it.
    2. The above code is just a UI trigger that updates the end_date value after the start_date input is changed by the user. So it’s all in the frontend.
    Login or Signup to reply.
  2. 0

    This worked for me.

    const startDate = document.querySelector('#start_date');
const endDate = document.querySelector('#end_date');

startDate.addEventListener('change', function() {
  endDate.value = startDate.value;
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search