Customization fields not showing in cart

[margo141]

Guy pls help. Customization fields not showing in cart. What can I do to make it work?

My website: 108creations.com

[theycallmemakka · Accepted solution]

Hi @margo141 

I have written custom script for this solution. Please follow below steps

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

{% if product %}
<script>
document.addEventListener('DOMContentLoaded', function() {
  // Select the element with the specified data-type attribute
  const addToCartForm = document.querySelector('[data-type="add-to-cart-form"]');
  const initialLetterInput = document.getElementById('enter-your-initial-letter');

  // Check if both elements exist
  if (addToCartForm && initialLetterInput) {
    // Create a new hidden input element
    const hiddenInput = document.createElement('input');
    // Set the attributes for the hidden input
    hiddenInput.type = 'hidden'; // Set the type to hidden
    hiddenInput.name = 'properties[Enter Your Initial Letter]'; // Set the name as required
    hiddenInput.value = ''; // Initial empty value
    
    // Append the hidden input to the add-to-cart form element
    addToCartForm.appendChild(hiddenInput);

    // Add an event listener to detect changes on the input field
    initialLetterInput.addEventListener('input', function() {
      // Update the hidden input's value whenever the user types
      hiddenInput.value = initialLetterInput.value;
    });
  } else {
    console.error('Required elements not found: [data-type="add-to-cart-form"] or #enter-your-initial-letter.');
  }
});

</script>
{% endif %}

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
Makka

[margo141]

Thank you soooooo much! You are amazing! It is working now!!!