【问题标题】:How to add different css style in a jsp list如何在jsp列表中添加不同的css样式
【发布时间】:2017-06-18 09:11:51
【问题描述】:

大家好,我需要有关 jsp(第一个屏幕)内列表的帮助。

我想这样格式化列表:

如何区分列表元素?后端方法好还是前端方法好?谢谢。

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>

【问题讨论】:

  • 请你显示你渲染的html
  • 有两个屏幕:)
  • Html 不是屏幕截图
  • 嗨皮特,代码在主题中:
  • 屏幕后有代码java和jsp(html)

标签: java css hibernate jsp foreach


【解决方案1】:

添加一个新的条件类来检查是否不是第一个索引。比如:

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

应该没问题。

【讨论】:

  • 啊,我明白了。我的建议是在后端的 listMenuItems 中添加一个新属性作为标志,以显示它们应该如何缩进,或者使用更多 CSS 和 JS 操作页面样式。
【解决方案2】:

这是渲染后的代码:

<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>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2011-06-23
    • 1970-01-01
    • 2015-10-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-07-17
    • 1970-01-01
    相关资源
    最近更新 更多