Wie man verschiedene CSS-Stil in einer JSP-Liste hinzufügen

Question

Hallo Leute, ich brauche Hilfe über eine Liste in einem JSP (erster Bildschirm).

Ich würde die Liste wie folgt zu formatieren:

Wie kann ich die Listenelemente unterscheiden? Ist ein Back-End-Ansatz oder ein Front-End-Ansatz besser? Danke.

JAVA

  List<Menu> listMenu = meRepo.listMenu(); 
      for (Menu menu : listMenu) { 
       MenuView mView = menuView.new MenuView(); 
       mView.setIdMenu(menu.getIdMenu()); 
       mView.setName(menu.getName()); 
       mView.setAction(menu.getAction()); 
       enableView.getListMenu().add(mView); 
      } 


      req.setAttribute(RequestAttributeKeys.VIEW_KEY, enableView); 
      dispatchForward("listEnableMenu.tiles"); 

JSP

<table class="table table-header-rotated"> 
<thead> 
    <tr> 
    <!-- First column header is not rotated --> 
    <th></th> 
    <!-- Following headers are rotated --> 
    <c:forEach var="listRole" items="${requestScope.view.listRole}" varStatus="counter"> 
     <th class="rotate"><div><span><c:out value="${listRole.nameRole}">  </c:out></span></div></th> 
    </c:forEach> 
</tr> 
    </thead> 
    <tbody> 
    <c:forEach var="listMenu" items="${requestScope.view.listMenu}" varStatus="counter"> 
     <tr> 
       <th class="row-header"><c:out value="${listMenu.name}"></c:out></th> 
       <c:forEach var="listRole" items="${requestScope.view.listRole}" varStatus="counter"> 
       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 
       </c:forEach> 
     </tr> 
    </c:forEach> 
</tbody> 
</table> 

Answer 1

eine neue bedingte Klasse hinzufügen zu überprüfen, ob das nicht der erste Index ist. Etwas wie:

< th class="row-header ${!counter.first ? 'indent-class' : ''}"> 

Sollte gerade gut.

Answer 2

Dies ist der Code nach machen:

<table class="table table-header-rotated"> 
<thead> 
    <tr> 
    <!-- First column header is not rotated --> 
    <th></th> 
    <!-- Following headers are rotated --> 

     <th class="rotate"><div><span>Super user</span></div></th> 

     <th class="rotate"><div><span>Gestore</span></div></th> 

     <th class="rotate"><div><span>Fatca Office</span></div></th> 

     <th class="rotate"><div><span>Responsabile antiriciclaggio</span> </div></th> 

     <th class="rotate"><div><span>22</span></div></th> 

     <th class="rotate"><div><span>Operatore</span></div></th> 

     <th class="rotate"><div><span>Diagnostico DPS</span></div></th> 

     <th class="rotate"><div><span>Responsabile intermediario</span></div></th> 

     <th class="rotate"><div><span>EDP</span></div></th> 

     <th class="rotate"><div><span>Group AML</span></div></th> 

     <th class="rotate"><div><span>AML Officer</span></div></th> 

     <th class="rotate"><div><span>Agenzia delle Entrate</span></div></th> 

     <th class="rotate"><div><span>Disattivato</span></div></th> 

</tr> 
</thead> 
    <tbody> 

     <tr> 

       <th class="row-header">MANAGEMENT PARAMETERS</th> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

     </tr> 

     <tr> 

       <th class="row-header">SYSTEM PARAMETERS</th> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

     </tr> 

     <tr> 

       <th class="row-header">Gestione Gruppi Intermediari</th> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

     </tr> 

     <tr> 

       <th class="row-header">Gestione Intermediari</th> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

     </tr> 

     <tr> 

       <th class="row-header">Gestione Ruoli</th> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

     </tr> 

     <tr> 

       <th class="row-header">Gestione Utenti</th> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

     </tr> 

     <tr> 

       <th class="row-header">Gestione Menu</th> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

     </tr> 

     <tr> 

       <th class="row-header">Gestione Politiche Password</th> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

     </tr> 

     <tr> 

       <th class="row-header">Gestione Application Suites</th> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

       <td><input name="column3[]" type="checkbox" value="row1-column3"></td> 

     </tr>