JSP中的代碼越來越多,冗余的內容自然也就多了,往往一個很小的改動你需要去改動N個頁面,工作量大不說,還容易出錯。今天帶你徹底解決這個問題!
tips:
- 這里需要使用:SpringContextHolder.java[Spring]無論你在哪我一直在
- 圖片點擊放大
本文介紹的是jsp:tag中的一般使用方式,另外一種叫做:jsp:tld,兩者同時使用並不沖突。我們習慣T們稱作頁面控件,通常一個項目中這兩者都會使用到。
- jsp:tag主要做頁面進行邏輯處理后顯示,最后的效果就是你可以給T一些參數,T會處理后把產生的結果顯示在頁面中。舉個栗子:<c:if>,<c:for>,<c:set> 都是這樣實現的,不信你ctrl點進去看看唄。
- jsp:tld會映射到一個具體的類的方法,最后的效果就是你可以在頁面上寫個標簽就可以把數據庫的數據顯示到頁面中。舉個栗子:<sec:authorize>,<shiro:hasRole>,不信你再試試。。。。哈哈哈哈
- 顯示只是其中一種用法,你可以根據你的業務場景和腦洞去想T可以有多少種用法,因為這個標簽屬於你。
- tag在本篇中並沒有去介紹T的使用方式,以后可以補上:[JSP]tag在項目中的應用
1.創建Tld文件
我的習慣是先在WEB-INF下創建一個tld文件夾,比如:WEB-INF/tlds
再創建我的Tld,我的命名習慣是fnXXX。比如:fnl.tld 最后的l是:Layout的縮寫
<?xml version="1.0" encoding="ISO-8859-1"?> <taglib xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-jsptaglibrary_2_1.xsd" version="2.1"> <tlib-version>1.0</tlib-version> <short-name>LayoutUtils</short-name> <uri>http://mycompany.com</uri> <!-- Invoke 'Generate' action to add tags or functions --> <function> <description>獲取節點列表</description> <name>getShutdownSiteList</name> <function-class>com.wttech.tciss.jsxy.utils.LayoutUtils</function-class> <function-signature>java.util.List getShutdownSiteList()</function-signature> <example>${fnc:getShutdownSiteList()}</example> </function> <function> <description>獲取節點選擇控件HTML</description> <name>getShutdownSiteHTML</name> <function-class>com.wttech.tciss.jsxy.utils.LayoutUtils</function-class> <function-signature>java.lang.String getShutdownSiteHTML()</function-signature> <example>${fnc:getShutdownSiteHTML()}</example> </function> </taglib>
JAVA文件:
import com.wttech.tciss.jsxy.core.service.ConfigService; import com.wttech.tciss.jsxy.core.service.statistics.ShutdownSiteService; import com.wttech.tciss.jsxy.core.utils.SpringContextHolder; import com.wttech.tciss.jsxy.core.vo.statistics.ShutdownSite; import org.apache.commons.lang3.StringUtils; import java.util.List; /** * * @ClassName:LayoutUtils * @Description:前端顯示控件工具類 * @author:ta0477 * @date:16/7/20 * */ public class LayoutUtils { private static ShutdownSiteService shutdownSiteServiceImpl= SpringContextHolder.getBean(ShutdownSiteService.class); private static ConfigService configServiceImpl= SpringContextHolder.getBean(ConfigService.class); //一些默認值 private static final String GETSHUTDOWNSITEHTML_SELECTID ="shutdownSiteId"; private static final String GETSHUTDOWNSITEHTML_SELECTNAME ="shutdownSiteName"; private static final String GETSHUTDOWNSITEHTML_SELECTDES ="年度信息"; /** * * @Title:getShutdownSiteList * @Description: 查詢所有節點信息 * @param:[] * @return:java.util.List<com.wttech.tciss.jsxy.core.vo.statistics.ShutdownSite> * @throw: * */ public static List<ShutdownSite> getShutdownSiteList(){ return shutdownSiteServiceImpl.findShutdownSiteList(); } /** * * @Title:getShutdownSiteSelect * @Description: 查詢所有節點信息並以HTML形式返回 * @param:[selectId, selectName, SelectDes] * @return:java.lang.String * @throw: * */ public static String getShutdownSiteSelect(String selectId,String selectName,String selectDes){ /** * <th class="r" width="116">年度信息:</th> <td width="220"> <select id="shutdownSiteId" name="selectName" class="form-control w210px"> <c:forEach var="site" items="${shutdownSites}"> <c:choose> <c:when test="${v.id==nowSite.id}"> <option value="${site.id}" selected>${site.year}</option> </c:when> <c:otherwise> <option value="${site.id}">${site.year}</option> </c:otherwise> </c:choose> </c:forEach> </select> </td> * */ //如果為空使用默認值 if (StringUtils.isNotBlank(selectId)) { selectId= GETSHUTDOWNSITEHTML_SELECTID; } if (StringUtils.isNotBlank(selectName)) { selectName= GETSHUTDOWNSITEHTML_SELECTNAME; } if (StringUtils.isNotBlank(selectDes)) { selectDes= GETSHUTDOWNSITEHTML_SELECTDES; } //獲取數據 List<ShutdownSite> shutdownSites=shutdownSiteServiceImpl.findShutdownSiteList(); //當前節點ID String nowSiteId=configServiceImpl.getNowShutdownSiteId(); //html 我覺得這種方式有些蠢!!! 不如直接在tag里使用tld獲取數據. StringBuilder html=new StringBuilder(); html.append("<th class=\"r\" width=\"116\">\n").append(selectDes).append(":</th>\n"); html.append("<td width=\"220\">\n"); html.append("<select id=\" ").append(selectId).append("\" name=\"").append(selectName).append("\" class=\"form-control w210px\">"); //for for (ShutdownSite site: shutdownSites) { //默認選中 if (nowSiteId.equals(site.getId())) { html.append(" <option value=\"").append(site.getId()).append("\" selected>").append(site.getYear()).append("</option>\n"); }else{ html.append(" <option value=\"").append(site.getId()).append("\">").append(site.getYear()).append("</option>\n"); } } html.append("</select>\n"); html.append("</td>\n"); return html.toString(); } //next }
2.使用Tld文件
我這里的需求是這樣:很多頁面都需要加年度選項來查詢數據,這些數據都來自於我的后台數據庫中,前台展示的方式都是使用select來展示。
我先在common.jsp中加入我的jsp:tld
<!--顯示控件tld--> <%@ taglib prefix="fnl" uri="/WEB-INF/tlds/fnl.tld" %>
在頁面中使用我的jsp:tld
注意: ${fnl:getShutdownSiteList()},fnl:getShutdownSiteSelect
<table class="w100"> <tr> <%--<layout:shudownsitelist selectId="shutdownSIteID" selectName="shutdownSIteID"/>--%> <th class="r" width="116">年度信息:</th> <td width="220"> <select id="shutdownSIteID" name="shutdownSiteName" class="form-control w210px"> <c:forEach var="site" items="${fnl:getShutdownSiteList()}"> <c:choose> <c:when test="${v.id==nowSite.id}"> <option value="${site.id}" selected>${site.year}</option> </c:when> <c:otherwise> <option value="${site.id}">${site.year}</option> </c:otherwise> </c:choose> </c:forEach> </select> </td> ${fnl:getShutdownSiteSelect("shutdownSIteID","shutdownSiteName","")} <th class="r" width="116">企業名稱:</th> <td width="220"><input class="form-control w210px" name="enterpriseName" id="enterpriseName" value=""/> </td> <td> <button class="btn btn-info" onclick="recordList()"><span class=" iconfa-search"></span> 查詢 </button> </td> </tr> </table>
最后的效果:一個加載好數據的下拉選項框。
- 如果其他地方需要這個內容我只需要將上面代碼再復制一行到其他頁面中即可。
- 如果哪天因為需求的變化,頁面的顯示效果需要修改,我找到我的tld修改完畢后所有使用這個控件的地方都被修改了。
最后:給看的個留個作業:完成getShutdownSiteSelect。。。。。還是算了吧(突然懶癌犯了不想打字了。。。。。。)!
希望這篇文章對你有所幫助,幫我點個贊吧。!!!!
歡迎你來和我交流學習。
原創禁止轉載!!!!!!