Cart page cannot get value from dropdown liquid code (product page)

[EmbroiGift]

I have coded 2 custom liquid dropdown list (Design Type & Placement) snippets on the product page. Used the tag, but the cart page cannot receive the value to display the value of the 2 dropdowns above. Here is the link to the product currently using dropdown https://embroigift.com/products/custom-dog-mom-and-dog-dad-embroidered-sweatshirt-with-pet-portrait

[Guleria]

Hello @EmbroiGift ,

Your select box is outside the form tag.

Keep them inside the form tag and it will work as you need.

Thanks

[devcoders]

Hello @EmbroiGift

Step 1: Update Your Product Page

Wrap each tag with an element to store the selected value as a line item property. Add JavaScript to update these hidden inputs based on the selected dropdown values. Here’s an example: Add this code form tag. The name attributes of each dropdown are set as attributes[Design Type] and attributes[Placement]. Using attributes syntax will ensure that Shopify treats them as line item properties, which will then appear on the cart page. Step 2: Test on the Cart Page After adding a product to the cart, go to the cart page and check if the selected options for “Design Type” and “Placement” display under the product in the cart. Shopify will automatically display line item properties added using attributes syntax without needing additional code on the cart page. Optional: Verify Custom Properties To display these properties on the cart page in a custom way, you can loop through line item properties in your cart template: liquid {% for item in cart.items %} {{ item.title }} {% for property in item.properties %} {% if property.last == blank %} {%- continue -%} {% else %} {{ property.first }}: {{ property.last }} {% endif %} {% endfor %} {% endfor %} This code will loop through each item in the cart and display its line item properties like “Design Type” and “Placement” if they exist. Let me know if you run into any issues!

[Guleria]

Sorry @devcoders but I’m not agree with you.

We don’t need any extra input tag.

We don’t need any extra form tag as we already have in our PDP page.

Also we don’t need any extra code in cart page, cart default code can manage it.

@EmbroiGift if you have any confusion you can check this https://ui-elements-generator.myshopify.com/pages/line-item-property

Thanks

[devcoders]

Hello @Guleria

Yes, we don’t want to use a new form tag. We need to add it to the existing one. The example was only given to help them understand.

[EmbroiGift]

Yes, thanks tomorrow i’ll test

Additional, how to set it required option like variant color, quantity, number of pets below,..

[Guleria]

Method to make the select field required:

but it will not work for you, because the theme is using ajax and ignores this required attribute.

If you want to make it required you need to write your own JS code.

Thanks

[EmbroiGift]

Hello, I’m testing to add a select box to the form tag, but how do I add it?
I code the custom liquid in the “Customize” section, not in “Edit Code”
There are two liquid code

Design Type *
Please Choose {% for option in product.metafields.custom.designtype.value %} {{ option }} {% endfor %}

Placement *
Please Choose {% for option in product.metafields.custom.placement.value %} {{ option }} {% endfor %}

Thanks

[Guleria]

Find the form tag in theme code.

[EmbroiGift]

I tried, but it still doesn’t work

[Guleria]

You are not following the instructions.

It will not work until you will not place it in the right place.

You can find simple instructions here https://ui-elements-generator.myshopify.com/pages/line-item-property

[EmbroiGift]

Sorry, but I don’t understand what you mean.
I have placed the above code inside

code here

Or can I send the main-product.liquid file so you can add it for me?

Thank you!