1

I am looking for a way to create a custom field to be used during the checkout process that a user can check if the would like to receive e-mail updates. I have attempted to add the {order_custom1} field and specified as a checkbox but it still returns a text input field. This is the code I am using.

<div class="control-group">
    <div class="controls">
        <label for="order_custom1" class="checkbox">
            {field:order_custom1} Check here if you would like to receive updates about The Journey
        </label>
    </div>
</div>

Is there anyway to do this?

4

The {field:something_here} tag will always create a text input with a few exceptions of countries, regions, and state fields will return a select box. If you want to addd a checkbox or radio or similar you would need to do something along the following:

<div class="control-group">
    <div class="controls">
        <label for="order_custom1" class="checkbox">
            <input type="checkbox" name="order_custom1" value="Yes" /> Check here if you would like to receive updates about The Journey
        </label>
    </div>
</div>

This will display "Yes" in the Store > Orders > Order Detail section.

To create any custom input element you just need to set the name of the input field to whatever you are trying to collect. One thing to mention that when you are not using the {field:somethinghere} approach for text inputs you need to use the field name in curly brackets in the value field if you would like to repopulate the existing information.

<input type="text" name="billing_address" value="{billing_address}" />
3
  • No problem, I updated my answer with a bit more information – Justin Long Oct 9 '13 at 18:48
  • If I would have multiple checkbox options for that field what would the code look like? I just can't figure it out. I have 5 possible options for my order_custom2 field. – Kevin Chatel May 14 '15 at 17:41
  • <input type="checkbox" name="order_custom2" value="1" /> <input type="checkbox" name="order_custom2" value="2" /> <input type="checkbox" name="order_custom2" value="3" /> <input type="checkbox" name="order_custom2" value="4" /> <input type="checkbox" name="order_custom2" value="5" /> – Justin Long May 15 '15 at 17:43
1

In addition to Justin's answer, another thing to keep in mind is that if you are creating your own input field with a checkbox, you need to use a hidden field to set the unchecked state.

If an HTML checkbox is unchecked, nothing at all gets submitted and so in that case Store will not update the stored value in the cart.

You can solve this by putting a hidden input with the same name immediately before your checkbox. If the checkbox is selected, the second value will take priority, otherwise it will fall back to the default:

<input type="hidden" name="order_custom1" value="No" />
<input type="checkbox" name="order_custom1" value="Yes" {if order_custom1 == "Yes"}checked{/if} />

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.