Activate Checkout Button only if delivery date selected is 3 days from today

Highlighted
New Member
6 0 0

Hello,

Currently, the checkout button will be shown only if the delivery date is selected. I would like the checkout button to be shown only if the delivery date selected is 3 days from today.

How can I achieve this? 

{% if cart.attributes.date != blank %}
      <button type="submit" name="checkout" class="btn cart__checkout">
       {{ 'cart.general.checkout' | t }} <span class="icon icon-arrow-right" aria-hidden="true"></span>
      </button>
{% else %
      <font size="3.5"
         face="helvetica"
         color="red">              
      <p>Please select a delivery date and update cart</p>
      </font>
{% endif %}

 

0 Likes
Highlighted
Shopify Partner
1084 221 286

Hello,

 

You can achieve this with JS.
Basic concept is you have to get the date on-change or on-keyup ( Jquery functions ) of date picker or what field you are using for date and time.

Once you get the selected date of user then you have to write a IF condition and make a comparison b/w current date and user selected date.

Next step if to use show() and hide() function of Jquery a/to comparison result.

And initially you can hide you checkout button so it will not visible until user will not enter date.

 

Thanks

 

Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate small Click here (Its my paypal)
0 Likes
New Member
6 0 0

Thank you Guleria, for your response. I am not well versed with coding. I added the delivery date picker to the cart page by following the shopify tutorial. This functionlity is working fine.

https://shopify.dev/tutorials/customize-theme-add-date-picker-for-delivery-dates

In the datepicker minDate is set to +3. However, user is able to change the date by typing in the date field. I want to avoid user changing the date manually by typing.

The checkout button is hidden initially and it is shown only after the delivery date is selected. But, there is no way check if the delivery date selected in +3 days from today. User can even enter past days by typing manually. Is there a way a check can be added so that the check out button will be shown only if the delivery date is +3 days from order date? Currently, it is only checking if the delivery date field is blank or not. 

 

 

 

0 Likes