I have a tag h:selectManyCheckbox, in it a loop over a list. for each item in the list I need a checkbox. Unfortunately the format of the checkbox + label does not correspond to the table which jsf creates. I need a div around each item, like this:
<div class="form_control var_checkbox">custom
<input type="checkbox" class="checkbox" name="service" id="service_0" data-product="additional_price" data-product-add-price="100.0">
<label class="label" for="service_0">title</label>
<span class="guarantee_price">CHF 100.0</span>
</div>
but jsf renders it like this:
<table>
<tbody>
<tr>
<td><input id="addToCart:j_id_29_2:0" type="checkbox" name="addToCart:j_id_29_2" value="0"><label for="addToCart:j_id_29_2:0"> title</label></td>
<td><input id="addToCart:j_id_29_2:1" type="checkbox" name="addToCart:j_id_29_2" value="1"><label for="addToCart:j_id_29_2:1"> titel2</label></td>
</tr>
</tbody>
</table>
here's the code currently generating it:
<h:selectManyCheckbox value="${addToCartBean.selectedServicesIndexes}">
<c:forEach items="#{productServicesJSFBean.productServicePlusBeanKeySet}" var="productServicePlusKey">
<c:forEach items="#{productServicesJSFBean.productServicePlusBeans[productServicePlusKey]}" var="productServicePlus">
<div class="form_control var_checkbox">
<f:selectItem itemValue="${counter}" itemLabel="${productServicePlus.servicePlusDisplay.title}" >custom </f:selectItem>
</div>
<c:set var="counter" value="${counter + 1}"/>
</c:forEach>
</c:forEach>
</h:selectManyCheckbox>
I tried creating the checkbox by hand, but jsf doesnt pick it up. We can not use a table, it has to be in the div format. How can I change how jsf renders those selectItems. I dont want it globally, only for those here. How can I do that?