JSTL动态生成HTML表格

转自此

最近在做一个小组项目，对于使用js与JSTL生成HTML代码做了小思考，看到了这篇博客，转一波！！

项目中遇到一个动态生成表格的问题，由于表格的行和列都不是固定的，而是从数据库中取得的，因此需要动态的创建表格。

由于规范中要求使用JSTL标签库，避免JSP页面冗余java代码，而我的数据库暂时又连不上（电脑有点问题），只能是自己给自己提供数据进行测试了。下面我做了一个小例子，测试了一下JSTL的可行性。废话不多说，直接看例子。

Java代码（部分代码）

[java]view plain copy
<span style="font-family:'Microsoft YaHei';font-size:14px;">ArrayList arrayList1 = new ArrayList();  
arrayList1.add("学号");  
arrayList1.add("姓名");  
arrayList1.add("性别");  
arrayList1.add("联系方式");  
  
ArrayList arrayList2 = new ArrayList();  
arrayList2.add(new String[]{"0001", "李明", "男", "10000"});  
arrayList2.add(new String[]{"0002", "王欢", "女", "10001"});  
arrayList2.add(new String[]{"0003", "张华", "女", "10002"});  
arrayList2.add(new String[]{"0004", "刘芳", "女", "10003"});  
arrayList2.add(new String[]{"0005", "赵六", "男", "10004"});  
arrayList2.add(new String[]{"0006", "刘影", "女", "10005"});  
      
request.setAttribute("arrayList1", arrayList1);  
request.setAttribute("arrayList2", arrayList2);</span>  

JSP代码

[html]view plain copy
<span style="font-family:'Microsoft YaHei';font-size:14px;"><%@ page language="java" contentType="text/html; charset=UTF-8"  
    pageEncoding="UTF-8"%>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>  
<%@ taglib prefix="custom" tagdir="/WEB-INF/tags" %>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>Test Dynamic Table</title>  
</head>  
<body>  
<div align="center">  
        <p></p>  
    </div>  
    <table width="80%" border="1px" cellpadding="0" cellspacing="0">  
        <thead>  
            <tr>  
                <c:forEach items="${arrayList1}" var="item">  
                    <th>${item}</th>    
                </c:forEach>  
            </tr>  
        </thead>  
        <tbody>  
            <c:forEach items="${arrayList2}" var="item">  
                <tr>  
                    <c:forEach var="i" begin="0" end="${fn:length(arrayList1)-1}" step="1">  
                        <td align="center">${item[i]}</td>  
                    </c:forEach>  
                </tr>  
            </c:forEach>  
        </tbody>  
    </table>  
</body>  
</html></span>  

效果图：

当然，这里知识做了一个简单的小例子，而且，这个例子的标题行是不固定的，添加了数据之后，JSP页面的EL表达式会直接将添加的数据显示出来，以达到动态生成表格的目的。

如果需求改变一下，标题行和第一列都是不固定的，都需要从数据库中读出具体的数量从而动态生成表格，从这个小例子中，我想对于后边的需求，你应该会受到一些启发的，有兴趣的自己去尝试一下吧。

完、、、、、、、、、、、

sky_s_limit

发布了15 篇原创文章 · 获赞 3 · 访问量 2232

私信关注

JSTL动态生成HTML表格

猜你喜欢