Craft Commerce: Adding Number fields to product and cart pages

Question

I'm adding the following to my _product.html template to try and add a number to a line item in the same way that notes are added. I'm using the following input:

<input type="number" name="numberDistance" step="any" placeholder="Add your minimum distance in mm..." id="distanceNum">

I then add the following to my cart template to output the field:

Min distance: {{ item.numberDistance }}

When I add an item to my cart I get the following error:

Craft\Commerce_LineItemModel and its behaviors do not have a method or closure named "numberDistance".

What is going wrong and how do I fix this?

Answer 1

You will need to make use of lineitem "options" param. You can attach as many options as you like using something like:

<input type="number" name="options[numberDistance]" step="any" placeholder="Add your minimum distance in mm..." id="distanceNum">

And then these will be avaliable on the lineItem once saved using

{{ item.options['numberDistance'] }}

More info can be found on the Craft Commerce docs