I have a list of possible products a user can buy. For doing it, I use ul tag combined with li. Every element has a checkbox that allows the user to choose if select the product or not.
Some products have related information. In order to describe this, I would like to store the data inside an hidden input. But because the selection and the information are related to a product I thought to use a label that contains the checkbox and the hidden input.
Something like
<label class="product">
<input class="product-checkbox" name="product1" type="checkbox">
<input type="hidden" name="product1-information" value="{...}" />
<span class="product-name">Product1</span>
</label>
If I understood correctly, a label cannot refer to an hidden input but in the above example, accordingly to the w3c, the labeled control is the checkbox.
Anyway I'm wandering if a label can contains checkbox and an hidden input.
So, is the above snipper correct?