前端jsp页面 枚举类 搜索 和 查询结果动态展示 （完全依赖接口 无需任何改动）

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/caox_nazi/article/details/83143187

前端页面 应对枚举类 搜索  和 查询结果展示 （完全依赖接口 无需任何改动）

 【问题现象产生】：后台接口方提供的枚举类型总是变动，导致前端页面如果写死枚举类型，容易展示出问题（搜索和查询展示），具体就是少展示或多展示

 【问题应对方案】：采用前端页面直接加载后台接口的枚举类

<%@ page import="com....enums.VerifyStatusEnum" %>
<%@ page import="com....enums.OrderTypeEnum" %>

<!--搜索的具体枚举类型 用于搜索字段点击搜索按钮后进行回显-->
<c:set var='searchVerifyStatus' value="${queryForm.verifyStatus}" scope="page"/>
<!--用于搜索展示字段具体枚举类的个数-->
<c:set var="orderTypeSize" value="<%=OrderTypeEnum.values().length%>" scope="page"/>


<!--搜索条件展示 写法-->
<!--vse.code ：VerifyStatusEnum枚举类的编码 vse.desc ：枚举类的描述-->
<div class="span" style="width:100px;">搜索字段名称</div>
<div class="span" style="width:12%;">
    <select name="verifyStatus" id="verifyStatus" class="select">
        <option value="">&nbsp;</option>
        <c:forEach items="<%=VerifyStatusEnum.values()%>" var="vse">
            <option value="${vse.code}"  <c:if test="${vse.code == searchVerifyStatus}">selected</c:if> >${vse.desc}</option>
        </c:forEach>
    </select>
</div>


<!--搜索结果展示 写法-->
<!--搜索结果展示 对应OrderTypeEnum枚举类 c:when 控制展示样式 -->
<div class="block-fluid">
    <table class="table-hover" style="width: 100%">
        <thead>
        <tr>
            <th width="1%"><input id="df" type="checkbox" class="checkall"/></th>
            <th width="">搜索结果展示字段描述</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${queryModel.pageInfo.resultList}" var="receipt">
            <tr>
                <td class="TAC"><input type="checkbox" name="check[]" value="${receipt.id }"/></td>
                <td>
                    <div style="display: block">
                        <c:forEach items="<%=OrderTypeEnum.values()%>" var="ote" varStatus="status">
                            <c:if test="${receipt.orderType == ote.code}">
                                <c:choose>
                                    <c:when test="${(status.count % orderTypeSize) == 0 ? true : false}">
                                        <span class="label label-success">${ote.desc}</span>
                                    </c:when>
                                    <c:when test="${(status.count % orderTypeSize) == 1 ? true : false}">
                                        <span class="label label-info">${ote.desc}</span>
                                    </c:when>
                                    <c:when test="${(status.count % orderTypeSize) == 2 ? true : false}">
                                        <span class="label label-success">${ote.desc}</span>
                                    </c:when>
                                    <c:when test="${(status.count % orderTypeSize) == 3 ? true : false}">
                                        <span class="label label-warning">${ote.desc}</span>
                                    </c:when>
                                    <c:when test="${(status.count % orderTypeSize) == 4 ? true : false}">
                                        <span class="label label-important">${ote.desc}</span>
                                    </c:when>
                                    <c:otherwise>
                                        <span class="label label-info">${ote.desc}</span>
                                    </c:otherwise>
                                </c:choose>
                            </c:if>
                        </c:forEach>
                    </div>
                </td>
            </tr>
        </c:forEach>
        </tbody>
    </table>

注： 其中<c:set>用法 参考之前博文地址：地址