Hi,
I'm working on a Shopify store with the 'Dawn' theme in use. We wanted to get some extra data from our user like their Instagram handle, gender and age, to get a better idea of the customers buying the products. The store doesn't run on a Shopify Plus plan so we decided to work with custom cart attributes, which I added in through the main-cart-items.liquid file. The fields aren't required, only for customers who'd like to answer. I tried this on a development server and everything works as expected, the data in those fields is saved in the new Shopify order under the 'additional details' tab.
When I use the exact same code setup on the live Shopify store however, nothing gets saved. The form does actually show up on the cart page, the data just isn't saved with the order once you continue on to checkout. I saw some similar posts but no one seems to have found a solution yet.
I can't seem to find any reason as to why this doesn't / shouldn't work on the live store running the same theme and everything.
My custom cart fields added to the main-cart-items.liquid:
<div class="cart-attributes__wrapper">
<p class="cart-attributes__title">We would love to get to know you a little better before you order.</p>
<p class="cart-attribute__field cart-attribute__field--singular cart-attribute__field--first">
<label for="instagram-handle">Instagram handle</label>
<input form="cart" class="cart-attribute__field-input" id="instagram-handle" type="text" name="attributes[Instagram handle]" value="{{ cart.attributes["Instagram handle"] }}">
</p>
<p class="cart-attribute__field cart-attribute__field--singular">
<label for="age">Age</label>
<input form="cart" class="cart-attribute__field-input" id="age" type="number" name="attributes[Age]" value="{{ cart.attributes["Age"] }}">
</p>
<div class="cart-attribute__field cart-attribute__field--radio">
<label>Gender</label>
<div class="radiobuttons-wrapper">
<label class="radio-wrapper">
Male
<input form="cart" type="radio" class="cart-attribute__radio-input" name="attributes[Gender]" value="M"{% if cart.attributes["Gender"] == "M" %} checked{% endif %}>
<div class='radio__checkmark'></div>
</label>
<label class="radio-wrapper">
Female
<input form="cart" type="radio" class="cart-attribute__radio-input" name="attributes[Gender]" value="F"{% if cart.attributes["Gender"] == "F" %} checked{% endif %}>
<div class='radio__checkmark'></div>
</label>
<label class="radio-wrapper">
X
<input form="cart" type="radio" class="cart-attribute__radio-input" name="attributes[Gender]" value="X"{% if cart.attributes["Gender"] == "X" %} checked{% endif %}>
<div class='radio__checkmark'></div>
</label>
<label class="radio-wrapper">
I'd rather not say
<input form="cart" type="radio" class="cart-attribute__radio-input" name="attributes[Gender]" value="I'd rather not say"{% if cart.attributes["Gender"] == "I'd rather not say" %} checked{% endif %}>
<div class='radio__checkmark'></div>
</label>
</div>
</div>
</div>
Does anyone have any idea to fix this on the live site? It's quite difficult to keep testing new orders, seeing as the site is live and we can't take it offline so we're testing whenever we know there probably won't be any new orders coming in.
