mardi 2 janvier 2018

Spring form checkboxes - Putting each 2 checkboxes in one row

I've been trying to put each 2 Spring Form checkboxes in a separate table row using bootstrap but I couldn't.
Here's my code:

<f:form action="/saveEvent" modelAttribute="event" method="post" id="eventForm">

...

        <div class="form-group">
            <label>Trainers</label><br>
            <f:checkboxes path="trainers" items="${trainersList}" 
                          element="div class='col-md-6 checkbox form-control' 
                          CssStyle='float:right'"
                          itemLabel="fullName" itemValue="id" delimiter=""/>
        </div>
</f:form>

And this is the result I am getting

Current result screenshot

And here's the generated HTML code

<div class="form-group">
    <label>Trainers</label><br>
    <div class="col-md-6 checkbox form-control" cssstyle="float:right">
    <input id="trainers1" name="trainers" type="checkbox" value="6" checked="checked">
    <label for="trainers1">Walid Mbarek</label>
  </div>
  <div class="col-md-6 checkbox form-control" cssstyle="float:right">
    <input id="trainers2" name="trainers" type="checkbox" value="7" checked="checked">
    <label for="trainers2">Bouraoui Chebili</label>
  </div>
  <div class="col-md-6 checkbox form-control" cssstyle="float:right">
    <input id="trainers3" name="trainers" type="checkbox" value="14">
    <label for="trainers3">Randy Ross</label>
  </div>
  <div class="col-md-6 checkbox form-control" cssstyle="float:right">
    <input id="trainers4" name="trainers" type="checkbox" value="17">
    <label for="trainers4">Mohamed Ali Thaier</label>
  </div>
  <div class="col-md-6 checkbox form-control" cssstyle="float:right">
    <input id="trainers5" name="trainers" type="checkbox" value="21" checked="checked">
    <label for="trainers5">Echrak Saidani</label>
  </div>
  <div class="col-md-6 checkbox form-control" cssstyle="float:right">
    <input id="trainers6" name="trainers" type="checkbox" value="25">
    <label for="trainers6">Marwen Chatti</label>
  </div><input type="hidden" name="_trainers" value="on"> </div>

I really like the way they look now, but the way I need them to display is a pair per row.

I also need the result to be in a table because I will have a search filter based on js that works only with tables




Aucun commentaire:

Enregistrer un commentaire