JavaEE企业级应用开发教程实验十 Spring MVC数据绑定和响应

小孙同学1024

已于 2023-11-21 16:03:06 修改

阅读量1.3k

点赞数 2

分类专栏： JavaEE实验报告文章标签： spring java-ee mvc

于 2023-06-15 21:44:39 首次发布

本文链接：https://blog.csdn.net/Annzz123/article/details/131236294

版权

JavaEE实验报告专栏收录该内容

12 篇文章 64 订阅

订阅专栏

实验十: Spring MVC数据绑定和响应

一、实验目的

1.熟悉简单数据类型的绑定

2.熟悉复杂数据类型的绑定

3.掌握Spring MVC数据绑定的使用

4.掌握Spring MVC的数据响应

5.掌握不同类型返回值的页面跳转

二、实验内容

1.实现默认类型数据绑定、简单数据类型绑定、POJO绑定、自定义类型转换器

2.实现数组绑定、集合绑定、复杂POJO绑定—属性为对象类型的数据绑定

3.JSON数据格式应用

三、实验步骤

1.实现默认类型数据绑定、简单数据类型绑定、POJO绑定、自定义类型转换器

（1）实现默认类型数据绑定

① 在IDEA中创建项目，在pom.xml中引入相关依赖，并在SpringMVC的配置文件spring-mvc.xml中完成相关配置

② 创建处理器类

在src\main\java文件夹中创建com\sun\controller文件夹，在文件夹中创建UserController类

package com.sun.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import javax.servlet.http.HttpServletRequest;
@Controller
public class UserController {
    @RequestMapping("/getUserId")
    public void getUserId(HttpServletRequest request){
        String userid=request.getParameter("userid");
        System.out.println("userid="+userid);
    }
}

运行结果：

启动项目后在浏览器输入http://localhost:8090/sy_ch10/getUserId?userid=1

（2）简单数据类型绑定

修改文件UserController.java，新增getUserNameAndId方法

@RequestMapping("/getUserNameAndId")
public void getUserNameAndId(String username,Integer id){
    System.out.println("username"+username+",id"+id);
}

运行结果：

启动项目后在浏览器输入

http://localhost:8090/sy_ch10/getUserNameAndId?username=Spring&id=1

（3）POJO绑定

①创建User类

在src\main\java文件夹中创建com\sun\pojo文件夹，在文件夹中创建User类

package com.sun.pojo;
public class User {
    public String getUsername() {
        return username;
    }
    public void setUsername(String username) {
        this.username = username;
    }
    public String getPassword() {
        return password;
    }
    public void setPassword(String password) {
        this.password = password;
    }
    private String username;
    private String password;
}

②定义registerUser方法

修改文件UserController.java，新增registerUser方法

@RequestMapping("/registerUser")
public void registerUser(User user){
    String username=user.getUsername();
    String password=user.getPassword();
    System.out.println("username="+username+",password="+password);
}

③创建register.jsp文件

在src\main\webapp下创建register.jsp文件

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>注册</title>
</head>
<body>
    <form action="${pageContext.request.contextPath}/registerUser" method="post">
        用户名<input type="text" name="username"/><br>
        密    码<input type="password" name="password"/><br>
        <input type="submit" value="注册">
    </form>
</body>
</html>

运行结果：

启动项目后在浏览器输入http://localhost:8090/sy_ch10/register.jsp

（4）自定义类型转换器

① 创建日期转换类

在src\main\java\com\sun\controller文件夹中创建UserController类

package com.sun.convert;
import org.springframework.core.convert.converter.Converter;
import java.text.SimpleDateFormat;
import java.util.Date;
public class DateConverter implements Converter<String, Date> {
    private String datePattern = "yyy-MM-dd";
    @Override
    public Date convert(String source) {
        SimpleDateFormat sdf = new SimpleDateFormat(datePattern);
        try {
            return sdf.parse(source);
        } catch (Exception e) {
            throw new IllegalArgumentException("无效的日期格式，请使用这种格式：" + datePattern);
        }
    }
}

② 配置spring-mvc.xml文件

在src\main\resources文件夹中创建spring-mvc.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
                  http://www.springframework.org/schema/beans/spring-beans.xsd
                 http://www.springframework.org/schema/mvc
                  http://www.springframework.org/schema/mvc/spring-mvc.xsd
                  http://www.springframework.org/schema/context
               http://www.springframework.org/schema/context/spring-context.xsd">
    <context:component-scan base-package="com.sun.controller"/>
    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/pages/"/>
        <property name="suffix" value=".jsp"/>
    </bean>
    <mvc:annotation-driven/>
</beans>

③ 定义方法

修改文件UserController.java，新增getBirthday方法

@RequestMapping("/getBirthday")
public void getBirthday(@DateTimeFormat(pattern = "yyyy-MM-dd") Date birthday){
    System.out.println("birthday="+birthday);
}

运行结果:

启动项目后在浏览器输入http://localhost:8090/sy_ch10/getBirthday?birthday=2001-08-30

2.实现数组绑定、集合绑定、复杂POJO绑定—属性为对象类型的数据绑定

（1）实现数组绑定

① 创建实体类

在src\main\java\com\sun\pojo文件夹中创建Product类

package com.sun.pojo;
public class Product {
    public String getProId() {
        return proId;
    }
    public void setProId(String proId) {
        this.proId = proId;
    }
    public String getProName() {
        return proName;
    }
    public void setProName(String proName) {
        this.proName = proName;
    }
    private String proId;
    private String proName;
}

② 创建jsp页面

在src\main\webapp下创建products.jsp文件

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>提交商品</title>
</head>
<body>
    <form action="${pageContext.request.contextPath}/getProducts" method="post">
        <table width="220px" border="1">
            <tr>
                <td>选择</td>
                <td>商品名称</td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" name="proIds" value="1"/>
                </td>
                <td>Java基础教程</td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" name="proIds" value="2"/>
                </td>
                <td>JavaWeb案例</td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" name="proIds" value="3"/>
                </td>
                <td>SSM框架实战</td>
            </tr>
        </table>
        <input type="submit" value="提交商品">
    </form>
</body>
</html>

③ 创建商品处理类

在src\main\java\com\sun\controller文件夹中创建ProductController类

package com.sun.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class ProductController {
    @RequestMapping("/getProducts")
    public void getProducts(String[] proIds){
        for (String proId:proIds){
            System.out.println("获取到了ID为"+proId+"的商品");
        }
    }
}

运行结果：

启动项目后在浏览器输入http://localhost:8090/sy_ch10/products.jsp

点击多选框后点击提交：

（2）集合绑定

修改ProductController类的getProducts()方法

 @RequestMapping("/getProducts")
    public void getProducts(@RequestParam("proIds")List<String> proIds){
        for (String proId:proIds){
            System.out.println("获取到了ID为"+proId+"的商品");
        }
    }

运行结果：

启动项目后在浏览器输入http://localhost:8090/sy_ch10/products.jsp

（3）复杂POJO绑定—属性为对象类型的数据绑定

① 创建订单实体类

在src\main\java\com\sun\pojo文件夹中创建Order类

package com.sun.pojo;
public class Order {
    public String getOrderId() {
        return orderId;
    }
    public void setOrderId(String orderId) {
        this.orderId = orderId;
    }
    private String orderId;
}

② 修改User类

在User.java中添加

public Order getOrder() {
    return order;
}
public void setOrder(Order order) {
    this.order = order;
}
private Order order;

③ 添加方法

在UserController类中定义方法

@RequestMapping("/findOrderWithUser")
public void findOrderWithUser(User user){
    String username=user.getUsername();
    String orderId=user.getOrder().getOrderId();
    System.out.println("username="+username+",orderId="+orderId);
}

④ 创建jsp页面

在src\main\webapp下创建order.jsp文件

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>订单</title>
</head>
<body>
    <form action="${pageContext.request.contextPath}/findOrderWithUser" method="post">
        所属用户<input type="text" name="username"/><br>
        订单编号<input type="text" name="order.orderId"><br>
        <input type="submit" value="查询">
    </form>
</body>
</html>

运行结果:

启动项目后在浏览器输入http://localhost:8090/sy_ch10/order.jsp

3.JSON数据格式应用

（1）添加依赖

在项目的pom.xml中导入Jackson的依赖

<dependency>
    <groupId>com.fasterxml.jackson.core</groupId>
    <artifactId>jackson-core</artifactId>
    <version>2.9.2</version>
</dependency>
<dependency>
    <groupId>com.fasterxml.jackson.core</groupId>
    <artifactId>jackson-databind</artifactId>
    <version>2.9.2</version>
</dependency>
<dependency>
    <groupId>com.fasterxml.jackson.core</groupId>
    <artifactId>jackson-annotations</artifactId>
    <version>2.9.0</version>
</dependency>

（2）导入jQuery文件

在项目\webapp文件夹下创建名为js文件夹，将jQuery-3.6.0.js文件导入

（3）创建jsp页面

在src\main\webapp下创建product.jsp文件

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>异步提交商品</title>
    <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-3.6.0.js"></script>
</head>
<body>
    <form id="products">
        <table border="1">
            <tr>
                <th>商品id</th>
                <th>商品名称</th>
                <th>提交</th>
            </tr>
            <tr>
                <td>
                    <input name="proId" value="1" id="proId" type="text">
                </td>
                <td>
                    <input name="proName" value="三文鱼" id="proName" type="text">
                </td>
                <td>
                    <input type="button" value="提交单个商品" onclick="sumbmitProduct()">
                </td>
            </tr>
            <tr>
                <td>
                    <input name="proId" value="2" id="proId2" type="text">
                </td>
                <td>
                    <input name="proName" value="红牛" id="proName2" type="text">
                </td>
                <td>
                    <input type="button" value="提交多个商品" onclick="submitProducts()">
                </td>
            </tr>
        </table>
    </form>
    <script type="text/javascript">
        function sumbmitProduct() {
            var proId = $("#proId").val();
            var proName = $("#proName").val();
            $.ajax({
                url: "${pageContext.request.contextPath }/getProduct",
                type: "post",
                data: JSON.stringify({proId: proId, proName: proName}),
                contentType: "application/json;charset=UTF-8",
                dataType: "json",
                success: function (response) {
                    alert(response);
                }
            });
        }
        function submitProducts() {
            var pro1 = {proId: $("#proId").val(), proName: $("#proName").val()}
            var pro2 = {proId: $("#proId2").val(), proName: $("#proName2").val()}
            $.ajax({
                url: "${pageContext.request.contextPath }/getProductList",
                type: "post",
                data: JSON.stringify([pro1, pro2]),
                contentType: "application/json;charset=UTF-8",
                dataType: "json",
                success: function (response) {
                    alert(response);
                }
            });
        }
    </script>
</body>
</html>

（4）修改ProductController类中方法

在ProductController类中新增getProduct()方法和getProductList()方法

@RequestMapping("/getProduct")
public void getProduct(@RequestBody Product product){
    String proId=product.getProId();
    String proName=product.getProName();
    System.out.println("获取到了Id为"+proId+"名称为"+proName+"的商品");
}
@RequestMapping("/getProductList")
public void getProductList(@RequestBody List<Product> products){
    for (Product product:products){
        String proId=product.getProId();
        String proName=product.getProName();
        System.out.println("获取到了Id为"+proId+"名称为"+proName+"的商品");
    }
}

（5）配置spring-mvc.xml文件

在spring-mvc.xml文件中添加

<mvc:resources mapping="/js/**" location="/js/"/>

运行结果：

启动项目后在浏览器输入http://localhost:8090/sy_ch10/product.jsp

点击“提交单个按钮”后

小孙同学1024

关注

2
点赞
踩
20

收藏

觉得还不错? 一键收藏
打赏
0
评论
JavaEE企业级应用开发教程实验十 Spring MVC数据绑定和响应

在src\main\java文件夹中创建com\sun\controller文件夹，在文件夹中创建UserController类。在src\main\java\com\sun\controller文件夹中创建ProductController类。在src\main\java\com\sun\controller文件夹中创建UserController类。在src\main\java文件夹中创建com\sun\pojo文件夹，在文件夹中创建User类。
复制链接

扫一扫