In the Cart Show fields per value of price and quantity

[MarcPaul]

Hi 🙂

I try to show this form for each product == 0 in the cart.

          {% if item.original_line_price == 0 %}
            <div id="1kid" style="width:46%; float:left; margin: 2%; text-align: left;">
                <p class="cart-attribute__field">
                  <label for="creative-kids-voucher">Creative Kids Voucher Number (16 digits starting with 9999) test {{ item.product_id }}</label>
                  <label>Start by 9999 plus 12 digits</label>
                  <input required class="required" id="creative-kids-voucher" type="text" placeholder="9999123456789123" pattern="[9]{4}[0-9]{12}" title="Start by 9999 plus 12 digits" name="{{ item.product_id }}" value="{{ cart.attributes.product.product_id }}">
                </p>
                <p class="cart-attribute__field">
                  <label for="first-childs-full">Child's Full Name (as shown on voucher)</label>
                  <label>Start by a Capslock ex: Jhon Doe</label>
                  <input required class="required" id="first-childs-full" type="text" placeholder="Jhon Doe" title="Start by a Capslock ex: Jhon Doe" name="{{ item.product_id }}" value="{{ cart.attributes.product.product_id }}">
                </p>
                <p class="cart-attribute__field">
                  <label for="first-childs-date-of-birth">Child's Date of Birth</label>
                  <label>Format of the date of Birthday ex:mm/jj/aaaa 03/13/1999</label>
                  <input required class="required" id="first-childs-date-of-birth" type="text" pattern="\d{2}/\d{2}/\d{4}" placeholder="10/25/2012" title="Format of the date of Birthday ex:mm/jj/aaaa 03/13/1999" name="{{ item.product_id }}" value="{{ cart.attributes.product.product_id }}">
                </p>
                <p class="cart-attribute__field">
                  <label>Child Gender</label><br>
                  <select required class="required" id="{{ cart.attributes.product.product_id }}" name="Gender{{ cart.attributes.product.product_id }}">
                    <option value="Girl"{% if cart.attributes.product.product_id == "Girl" %} selected{% endif %}>Girl</option>
                    <option value="Boy"{% if cart.attributes.product.product_id == "Boy" %} selected{% endif %}>Boy</option>
                  </select>
                </p>
            </div>      
          {% endif %}

It works but if i have 2 time the same product it show me only 1 form instead of 2.

Do you have an idea ?

Thanks 🙂

Regards, 

[IttantaTech]

@MarcPaul ,

Try like this.

          {% if item.original_line_price == 0 %}
           {% for quantity in item.quantity %}
            <div id="1kid" style="width:46%; float:left; margin: 2%; text-align: left;">
                <p class="cart-attribute__field">
                  <label for="creative-kids-voucher">Creative Kids Voucher Number (16 digits starting with 9999) test {{ item.product_id }}</label>
                  <label>Start by 9999 plus 12 digits</label>
                  <input required class="required" id="creative-kids-voucher" type="text" placeholder="9999123456789123" pattern="[9]{4}[0-9]{12}" title="Start by 9999 plus 12 digits" name="{{ item.product_id }}" value="{{ cart.attributes.product.product_id }}">
                </p>
                <p class="cart-attribute__field">
                  <label for="first-childs-full">Child's Full Name (as shown on voucher)</label>
                  <label>Start by a Capslock ex: Jhon Doe</label>
                  <input required class="required" id="first-childs-full" type="text" placeholder="Jhon Doe" title="Start by a Capslock ex: Jhon Doe" name="{{ item.product_id }}" value="{{ cart.attributes.product.product_id }}">
                </p>
                <p class="cart-attribute__field">
                  <label for="first-childs-date-of-birth">Child's Date of Birth</label>
                  <label>Format of the date of Birthday ex:mm/jj/aaaa 03/13/1999</label>
                  <input required class="required" id="first-childs-date-of-birth" type="text" pattern="\d{2}/\d{2}/\d{4}" placeholder="10/25/2012" title="Format of the date of Birthday ex:mm/jj/aaaa 03/13/1999" name="{{ item.product_id }}" value="{{ cart.attributes.product.product_id }}">
                </p>
                <p class="cart-attribute__field">
                  <label>Child Gender</label><br>
                  <select required class="required" id="{{ cart.attributes.product.product_id }}" name="Gender{{ cart.attributes.product.product_id }}">
                    <option value="Girl"{% if cart.attributes.product.product_id == "Girl" %} selected{% endif %}>Girl</option>
                    <option value="Boy"{% if cart.attributes.product.product_id == "Boy" %} selected{% endif %}>Boy</option>
                  </select>
                </p>
            </div>      
         {% endfor %}
          {% endif %}

[MarcPaul]

Thank you so much for the reply.

Sadness it doesn't show anythings.

[IttantaTech]

@MarcPaul 

Can you please provide your store URL ? So that I can check this in detail

[MarcPaul]

Just to edit to give more info:

Currently on the website I show 1 voucher per product_ID detected.

But i would like to create something better to show this one when the product_original_price == 0 or equivalent 🙂

[MarcPaul]

https://7kj0uqk6b0ucrjt1-58604650675.shopifypreview.com

Share preview for the cart 

[MarcPaul]

Is someone has an idea ?