WooCommerce Checkout Field Editor Date Field Restrictions
At WooThemes we have an awesome add-on for WooCommerce called Checkout Field Editor. This add-on allows to add many new fields to the checkout page. This is a truly great plugin. You can add dropdown select list, checkboxes, radio buttons, and even date pickers. And pretty often people ask me how to apply restrictions on the the date fields types.
For example how to force customers to choose a date 4 days after today, or pick a date on a specific dates range etc… And Checkout Fields Editor doesn’t allow to do this by default. Well, that’s understandable, as this will not be used by all users of this add-on, just a few. So, to apply this restrictions on date fields I have a quick snippet for you.
This snippet will output some custom jQuery code in the footer of your site, it has to be placed in functions.php, in your theme folder:
As stated in jQuery UI documentation regarding minDate and maxDate:
Restrict the range of selectable dates with the minDate and maxDate options. Set the beginning and end dates as actual dates (new Date(2009, 1 – 1, 26)), as a numeric offset from today (-20), or as a string of periods and units (‘+1M +10D’). For the last, use ‘D’ for days, ‘W’ for weeks, ‘M’ for months, or ‘Y’ for years.
So, it’s up to you to edit minDate: 1 and adjust it to fit your needs. Enjoy!
Thank you very much for this tutorial. I have bought the woocommerce-checkout-field-editor and I need to setup un function like this one, but this code does not seem to work.
I am using a child theme (flatsome – ecommerce theme), my installation is local at the moment.
Is this tutorial still working on the most recent version of woocommerce?
Yes it should work fine.
2 related questions, if you have a minute:
1) Is there an easy way to also include disabled dates, whether individual dates or days of the week?
2) How would you do this with one of the `enqueue_script` hooks instead of just outputting the script into the footer?
I was wondering if this still worked. I added it to my theme’s functions.php and received errors. When I adjusted the lines with the errors it didn’t work for me.