EL+JSTL 遍历list

本文介绍如何使用Java标准标签库(JSTL)中的<c:forEach>标签在Web页面上循环展示后端传递过来的数据列表。具体展示了如何设置变量名称及获取列表中的每一项数据。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

   准备工作:<%@ taglib uri="http://java.sun.com/jstl/core_rt"  prefix="c"%> 

 后台:request.setAttribute("list",list);

将list放在request域中前端通过表达式遍历。

   前端: <c:forEach var="nav" items="${list}">

      <div id="nav">${nav.navShow}</div>

      </c:forEach>

注:其中var的内容代表循环的变量名称,items后面是对象。

在Java Web中,使用EL (Expression Language) 和 JSTL (JavaServer Pages Standard Tag Library) 来实现在线购物系统的商品显示功能,通常会涉及以下几个步骤: 1. **页面布局**: 创建一个JSP页面,如`product-list.jsp`,作为展示商品列表的模板。开始时可以包含 `<c:forEach>` 标签用于遍历商品集合。 ```jsp <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <!DOCTYPE html> <html> <head> <title>商品列表</title> </head> <body> <table border="1"> <tr> <th>ID</th> <th>名称</th> <th>价格</th> <th>操作</th> </tr> <c:forEach items="${products}" var="product"> <tr> <td><c:out value="${product.id}"/></td> <td><c:out value="${product.name}"/></td> <td><c:out value="${product.price}"/></td> <td><a href="#" data-id="${product.id}" class="delete-link">删除</a></td> </tr> </c:forEach> </table> </body> </html> ``` 2. **EL表达式**: - `${product.id}`: 获取当前商品对象的id属性。 - `${product.name}`: 获取商品名称。 - `${product.price}`: 获取商品价格。 3. **JavaBean或模型层**: 创建一个Java Bean (`Product`) 类,用于存储商品数据。在Servlet或控制器中填充这个商品集合(`List<Product> products`)并将其注入到页面上。 ```java // Product.java public class Product { private int id; private String name; private double price; // getters and setters } ``` 4. **服务器端控制**: Servlet或Spring MVC controller处理请求,并将数据传递给JSP。例如,在Spring MVC中,可以在`ProductController`中获取数据并返回到`product-list.jsp`。 ```java // ProductController.java @GetMapping("/products") public String productList(Model model) { List<Product> products = productService.getAllProducts(); // 假设有一个ProductService获取产品 model.addAttribute("products", products); return "product-list"; } ``` 5. **事件监听或AJAX**: 如果需要处理删除操作,可以添加点击事件监听并在后台通过AJAX发起删除请求。 ```javascript <script> $(document).ready(function() { $('.delete-link').click(function(event) { var productId = $(this).data('id'); $.ajax({ url: '/delete-product', type: 'DELETE', data: {id: productId}, success: function(response) { // 更新列表或提示删除成功 }, error: function() { alert('删除失败'); } }); event.preventDefault(); }); }); </script> ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值