liquid - Shopify Variant checkbox instead of dropdown -

i'm trying make variants display following image instead of default dropdown shopify provides.

i'm using following code, throws error when trying add basket. error states "parameter missing or invalid: required parameter missing or invalid: id"

      <form action="/cart/add" method="post" enctype="multipart/form-data">             {% variant in product.variants %}             {% if variant.available == true %}               <fieldset class="group">                 <ul class="checkbox">                   <li>                     <input type="checkbox" value="{{variant.id}}">                       <label>{{ variant.title }} {{ variant.price | money_with_currency }}</label>                     </input>                   </li>                 </ul>               </fieldset>             {% else %}             <option disabled="disabled"> {{ variant.title }} - sold out!</option>             {% endif %}             {% endfor %}             <input type="submit" name="add" id="add" class="inpost-buy w-button" value="add bag →"></input>       </form> 

you missing name attribute checkbox.

it should have name="id". ( or if determine have checkboxes , not radio buttons should name="id[]" )

---

in addition, not valid html code:

<input type="checkbox" value="{{variant.id}}">    <label>{{ variant.title }} {{ variant.price | money_with_currency }}</label> </input> 

you can't have label inside of input. other way around ok.

---

and there no point this, since not using select more:

<option disabled="disabled"> {{ variant.title }} - sold out!</option>