How to make a field required on cart page

CiaraChezCheese
Visitor
1 0 0

Hello there!

 

I have added custom code to add a 'delivery date picker' to my cart page. I want to make this a required step on my cart page so that the customer cannot proceed to checkout without selecting a date. Can anyone help?

 

Thank you!

Ciara

Replies 3 (3)

oscprofessional
Shopify Partner
15905 2378 3087

hI @CiaraChezCheese ,

 

Welcome to the Community.

Its a time consuming task as I understand. and If you are not having coding knowledge then we will help achieve your task easily and more cost-effectively if you are looking for task quickly & effectively!

you can check our store. https://www.oscprofessionals.com/

You can directly get connected with me via email or Skype.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing | Oscp Upsell & Cross sell App : Free | Oscp Sales & Volume Discount App : Free | Custom Pricing Wholesale App : Free

JayAdra
Shopify Partner
52 5 16

Hi Cirara,

 

This can be a little tricky depending on how your theme is structured and which date picker you're using.

 

If you have some Javascript knowledge, your best bet would be to add an event listener to the <form> on the cart page, and run some validation when the form is submitted.

 

That is how we provide this option with our Bloom date picker app. The code would be something like:

 

document.body.addEventListener("submit", function (e) {
  if (e.target.getAttribute("action") === "/cart") {
    if (document.querySelector('#ID-OF-DATEPICKER-FIELD').value === "") {
      e.preventDefault();
      e.stopPropagation();
      alert("Please select a delivery date");
      return false;
    }
  }
});

 

This should work for pretty much every theme.

 

Hope this helps! Best of luck.

jayne_Zapiet
Shopify Partner
9 0 0

Hi there,

 

The delivery date picker is included in the cart when using our app Store Pickup & Delivery

 

https://www.zapiet.com/shopify/store-pickup-delivery