bootstrap 实现用 table 表格显示list数据

来源：互联网发布：即时通讯软件下载编辑：程序博客网时间：2024/05/06 03:51

后台如何获取list数据的就不详细解释了，传递到前台的方式，我用的是

 model.addAttribute("categories",categories);

2.接下来前台可以通过${categories}来获取list数据
使用 foreach 循环显示数据以及其属性

<table class="table table-hover table-bordered">    <thead>    <tr>        <th hidden="hidden">序号</th>        <th>类别名称</th>        <th>助记码</th>        <th>操作</th>    </tr>    </thead>    <tbody id="J_template">    <c:if test="${fn:length(categories) == 0}">        <tr>            <td style="text-align: center;"> 无查询结果</td>        </tr>    </c:if>    <c:if test="${fn:length(categories) > 0}">        <c:forEach var="category" items="${categories}">            <tr id="item">                <td hidden="hidden">${category.id}</td>                <td>${category.name}</td>                <td>${category.mnemonicCode}</td>                <td>                    <div class="visible-md visible-lg hidden-sm hidden-xs action-buttons">                        <a id="editLink" class="blue"                           onclick="editCategory(${category.id},'${category.name}','${category.mnemonicCode}')"                           data-toggle="modal"                           data-target="#editModel"                           title="编辑" style="cursor:pointer;">[编辑]</a>                        <a id="delLink" class="blue"                           onclick="delCategory(${category.id})" data-toggle="modal"                           data-target="#tipModel"                           title="删除" style="cursor:pointer;">[删除]</a>                    </div>                </td>            </tr>        </c:forEach>    </c:if>    </tbody></table>

0 0