1

I've created a dropdown field for my users to select from on each of my products, but if the user was to select an option from the dropdown and click 'add to cart' , it doesn't show up in their order once it's all gone through.

What I currently have on my products page is:

<form method="POST" name="main">
    <input type="hidden" name="action" value="commerce/cart/update-cart">
    <input type="hidden" name="paymentCurrency" value="{{ currency }}">

    {{ redirectInput('cart') }}
    <input type="hidden" name="qty" value="1">
    {{ csrfInput() }}

    {% set max = product.max %} 
    {% set i = 0 %}

    <select name="options[max]">
        {% for i in 1..max %}
            <option value="{{ i }}">{{ i }}</option>
        {% endfor %} 
    </select>

    {%- for purchasable in product.getVariants() -%}
        {% if purchasable.isAvailable %}
            <input type="hidden" name="purchasables[0][id]" value="{{ purchasable.id }}" />
            <input type="hidden" name="purchasables[0][qty]" value="1" />
        {% endif %}
    {%- endfor -%}

    {%- for purchasable in product.getVariants() -%}
        {{ purchasable|currencySalePrice('' ~ currency ~ '') }}
    {%- endfor -%}

    <input type="submit" value="{{ "Add to cart"|t }}" class="button"/>
</form>

Any reason why 'add to cart' wouldn't update this info and show it in the customers order?

  • Could you paste your full form? – Luke Holder Jul 12 at 2:53
  • Updated with form – Amy Jul 12 at 8:52
1

First you need to figure out which one you are using.

LineItem Options: Here is the doc for it. https://docs.craftcms.com/commerce/v2/adding-to-and-updating-the-cart.html#line-item-options-and-notes

One thing worth to mention is that options store in lineItem, which is one set of options for each purchasable/variant. So in your form you should put the options in your for loop of the product.getVariants(). And have the loop index in front just like the purchasable. e.g.

<select name="options[0][max]">
        {% for i in 1..max %}
            <option value="{{ i }}">{{ i }}</option>
        {% endfor %} 
</select>

Same with your "qty" it needs to have loop index in front as well. See the documentation link for example: https://docs.craftcms.com/commerce/v2/adding-to-and-updating-the-cart.html#adding-multiple-purchasables-to-the-cart

Order Field: Didn't find documentation for it in craft CMS commerce 2 docs. Order field stores with order object. One order has one value for a unique field handle. You can use <input type="your-choice" name="fields[customFieldHandle]"/> in "commerce/cart/update-cart" action. You can retrieve it by calling order.customFieldHandle.

Before you use one custom field in the twig template you need to go your control panel and create a custom field first. "http://your-site.com/admin/commerce/settings/ordersettings". Find the "order fields" (name maybe different due to the version of craft, I don't think P&T have ever changed it since beginning.) tab, and create a field just like you would create a field for entry.

Try this form:

<form method="POST" name="main">
    <input type="hidden" name="action" value="commerce/cart/update-cart">
    <input type="hidden" name="paymentCurrency" value="{{ currency }}">

    {{ redirectInput('cart') }}
    {{ csrfInput() }}

    {% set max = product.max %}

    {%- for purchasable in product.getVariants() -%}
        {% if purchasable.isAvailable %}
            <input type="hidden" name="purchasables[{{loop.index}}][id]" value="{{ purchasable.id }}" />
            <select name="options[{{loop.index}}][max]">
             {% for i in 1..max %}
                <option value="{{ i }}">{{ i }}</option>
             {% endfor %} 
            </select>
            <input type="hidden" name="purchasables[{{loop.index}}][qty]" value="1"/>
        {% endif %}
    {%- endfor -%}

    {%- for purchasable in product.getVariants() -%}
        {{ purchasable|currencySalePrice('' ~ currency ~ '') }}
    {%- endfor -%}

    <input type="submit" value="{{ "Add to cart"|t }}" class="button"/>
</form>

If you want customer to choose one options and apply for all the purchasables.

Just put a hidden input in the for loop and then use JavaScript function to update options in the loop on change.

  • the qty how it is is intentional, I did try your version of the select and it still hasn't worked. I find that this only works when I add an additional 'update' button, but I really want to avoid doing. – Amy Jul 12 at 9:52
  • Try the form I just posted. – Parry Huang Jul 12 at 10:06
  • afraid this didn't work either :/ – Amy Jul 12 at 10:22
  • Can you try to add to cart again? And take a look at the storage/logs/web.log. Search for the unique value of the product/purchasable you just try add to cart. See if you can find any error. – Parry Huang Jul 16 at 2:31
  • Nothing out of the ordinary in the logs, which made me think it's not doing anything with the custom field. – Amy Jul 16 at 9:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.