I’m thinking that maybe I can create 3 sections and then using interactions to hide / slide in the preivous / next section´triggered by button clicks? That solves the “form” part, but the custom attributes are linked to a product selection in the API. So how can I separate this part in 3 steps?
The major difference between the order custom fields and the metadata is that metadata is hidden from the customer. This means it will not appear on the invoice nor the cart.
<script>
const button = document.querySelector('#Your add to cart button')
const selectCompetition= document.querySelector('#your competition question select field')
quantity.addEventListener('change', () => {
// Sets the value for charity
button.setAttribute("data-item-custom1-value", selectCompetition.value)
})
const selectCharity = document.querySelector('#your charity to donate select field')
select.addEventListener('change', () => {
// Sets the value for charity
button.setAttribute("data-item-custom2-value", selectCharity .value)
})
</script>
You can also use ``` data-item-custom1-type="hidden"
if you do not want to display these fields in the cart. or
`data-item-custom1-type="readonly"`
You can find this at end of this page: [https://docs.snipcart.com/v3/setup/products](https://Products-snipcart)
If you need any further help I am here to help you.
Thanks,
Dilshad
Seems like you’re an expert with the snipcart intergration! Just gonna try my luck here an hopefully I can get your help.
Basically, I want these displayed and can be input on the products page and have them reflected in the cart after adding to cart. However, I am a complete newbie with JS and I have been trying to read up but did not manage to get these solved.
1.) Product variations – How do I get the select field to retrieve the variations from my CMS. Problem I am facing is that using the +Add Field retrieves the entire line eg.(Oak|Walnut[+10]|Walnut (L)[+70]) instead of having them separated into different options.
2.) I would like to have data-item-custom1-name=“Custom Name” on the products page too.
Really appreciate your help or any other experts out there!