All things Shopify and commerce
I am trying to add mandatory check buttons to 2 of my custom product pages. I have the boxes but it is allowing to not check boxes and checkout. I have tried all the things I have found on here and google and nothing works
myself. I have managed doing all without trouble
To make sure that the checkboxes on your custom product pages are mandatory and customers cannot proceed to checkout without selecting them, you'll need to add some custom code to your store. Here's how you can do it:
Locate the product form code: Go to the Edit product page of your custom product, and locate the product form code. This is the code that generates the product options and add to cart button on the page.
Add the required attribute to your checkboxes: Find the code for the checkboxes on your custom product page, and add the required
attribute to each checkbox input element. Here's an example of what the code should look like:
<input type="checkbox" name="option1" value="option1" required>
If this does not work, you can also try adding some custom JavaScript code to your store that will prevent checkout until the required checkboxes have been selected. Here's an example of what the code should look like:
$(document).on('click', '.checkout-btn', function(event) { if ($('.checkbox-input:checkbox:checked').length < 2) { event.preventDefault(); alert('Please select both checkboxes before proceeding to checkout.'); } });
This code will check to see if both checkboxes have been selected when the customer clicks the checkout button. If either checkbox is not selected, it will prevent checkout and display an error message.
Remember to replace .checkbox-input
with the class name of your checkbox inputs, and 2
with the number of checkboxes that are required to be selected.
I hope this helps! Let me know if you have any other questions.
I tired both and neither worked where would I put the java one? maybe im putting in wrong place
this is how its typed
$(document).on('click', '.checkout-btn', function(event) { if ($('.Yes I have uploaded high resolution files (PNG 300dpi, SVG, EPS, Illustrator), Yes I have uploaded with transparent background:checkbox:checked').length < 2) { event.preventDefault(); alert('Please select both checkboxes before proceeding to checkout.'); } });
bolded are checkbox names
I think his code can solve your probem
https://edcodes.gumroad.com/l/terms-checkbox?layout=profile
User | RANK |
---|---|
43 | |
40 | |
24 | |
24 | |
22 |
Transform this holiday season into a shopping spree. Plus, learn how to effortlessly open ...
By Jasonh Dec 8, 2023Make the shift from discounts to donations, and witness your business not only thrive fina...
By Holly Dec 4, 2023On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023