Support

Account

Home Forums General Issues How to use ACF datepicker for start date less than end date validation

Solving

How to use ACF datepicker for start date less than end date validation

  • HI All,

    I am facing an issue related to how to validate the start date and end date fields BY ACF datepicker date type field.

    Here, start date should be less than or equal to end date. Now i am not able to understand how to use the conditional logic for this in backend while inserting this data for a custom post type.

    Hoping for you reply.

    Regards.

  • Hi @architbjoshi,

    I’m guessing by start date and end date fields you’re referring to two date fields you’ve created.
    Unfortunately there’s no such logic built into ACF.
    Your only option is to insert your own script on your admin page with which you update the datepicker options.

    You can use this filter to add your custom script file:
    http://www.advancedcustomfields.com/resources/acfinputadmin_enqueue_scripts/

    And then you’ll need to check when either start or end date input has been changed and modify the other field accordingly.

    
    //To set a minimum date (back in time)
    jQuery( '.acf-field-UNIQUEID .acf-date_picker input.input' ).datepicker( 'option', 'minDate', date.format() );
    //To set a maximum date (forward in time)
    jQuery( '.acf-field-UNIQUEID .acf-date_picker input.input' ).datepicker( 'option', 'maxDate', date.format() );
    
  • Thanks Jonathan,

    I thought to use conditional logic for this, but i am not able to find if i could do using this.

    If only using jquery validation this is possible then, i will do the needful.

    Thanks for your quick support.

  • Hi,

    Yes this is absolutely possible and it’s not even validation. It’s more about limiting the datepickers depending on each other..

    I’ve done exactly this myself but on a front end ACF form so I’m certain it works.
    Good luck!

  • I have the same issue, but i did resolved it. Now user can not choose the start date greater than end date. I simply add a function in my functions.php file.

    
    //  Date Picker Validation --- Start Date should be less than End Date.
    
        add_action('acf/validate_save_post', 'my_acf_validate_save_post', 10, 0);
    
        function my_acf_validate_save_post()
        {
    
            $start = $_POST['acf']['key of datepicker 1'];
            $start = new DateTime($start);
    
            $end = $_POST['acf']['key of datepicker 2'];
            $end = new DateTime($end);
    
            // check custom $_POST data
                if ($start > $end) {
                    acf_add_validation_error('name of datepicker field you want to display error message. ', 'End Date should be greater than or Equal to Start Date');
                }
        }
    
    

    In this i have select two datepicker and then converted them to date format then compared them as you can see above.

    * You can get key of ACF field from sreen option and then selecting field keys
    * You can select the name of the field by inspecting in chrome and selecting the datepicker input field.

  • How can this be achieve when the from_date and to_date are in a repeater?

  • I’ve been playing with this issue and found a solution that works for me by compiling a few solutions I found.

    add_filter('acf/validate_value/name=date_time_end', 'validate_end_date_func', 10, 4);
    function validate_end_date_func($valid, $value, $field, $input) {
    	if (!$valid) {
    		return $valid;
    	}
    	$start_key = 'field_5f46d8cef3f0a';
    	$end_key = 'field_5f46d8eaf3f0b';
    	$start_value = $_POST['acf'][$start_key];
    	$start_value = new DateTime($start_value);
    	$end_value = $_POST['acf'][$end_key];
    	$end_value = new DateTime($end_value);
    	
    	if ($end_value <= $start_value) {
    		$valid = 'The end date must come after the start date for this event.';
    	}
    	return $valid;
    }

    Like noted above:

    * For the $start_key and $end_key You can get key of ACF field from screen option and then selecting field keys.
    * In line 1 where name=date_time_end set date_time_end to your field name.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.