SpringMVC整合Ajax实现批量新增数据方法详解

需要注意的问题

在实现SpringMVC结合Ajax进行批量新增功能时，有几个常见的“坑”需要提前留意。这些细节如果处理不当，很容易导致功能无法正常运行。具体来说，主要集中在以下几个方面：

免费影视、动漫、音乐、游戏、小说资源长期稳定更新！ 👉 点此立即查看 👈

• MVC框架中，如何正确处理前端传递的日期格式字符串。
• 当使用@ResponseBody注解返回一个自定义对象时，响应体却不是预期的JSON格式。
• 即便响应成功转为JSON，对象中的日期字段也变成了一个难以理解的long类型数字。
• 最后，也是最关键的一步：后端Controller方法的参数，究竟该如何定义，才能一次性接收前端批量提交的多个对象数据？

页面代码

首先来看前端页面的实现。这里构建了一个动态表格，允许用户动态增行、移除行来录入访客信息，最后通过Ajax将整批数据提交到后端。

<%@ page language="ja va" isELIgnored="false" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
姓名
身份证
时间
direction
type
操作
进入离开
 内部 外部

这里的前端逻辑有个值得讨论的地方：移除行的实现。代码采取了一种比较“彻底”的方式——先移除所有行，再根据当前索引重新生成所有行。这种方式逻辑上可行，但每次移除都要重绘整个表格，对于数据量大的情况可能不是最优解。不过，对于理解和演示核心流程来说，它清晰地体现了如何通过索引（如“visitorList\[0\]”）来组织表单数据，为后端批量接收铺平了道路。

Controller定义参数接收

前端数据准备好了，后端该如何接招呢？关键就在于用一个专门的“包装类”来接收整个列表。

我们定义一个名为BatchVisitor的实体类，其核心就是一个VisitorInfo对象的集合：

package cn.bitqian.entity;

import ja va.util.ArrayList;
import ja va.util.List;

/**
 * 批量新增 visitorInfo
 * @author echo lovely
 * */
public class BatchVisitor {

    private List visitorList = new ArrayList<>();

    public List getVisitorList() {
        return visitorList;
    }
    public void setVisitorList(List visitorList) {
        this.visitorList = visitorList;
    }

    public BatchVisitor() {
    }
}

有了这个包装类，Controller方法的参数定义就变得非常清晰和优雅了：

@RequestMapping(value="/batchAdd", method=RequestMethod.POST)
@ResponseBody
public VisitorInfo batchAddVisitor(BatchVisitor batchVisitor) {
    List visitorList = batchVisitor.getVisitorList();
    // System.out.println(batchVisitor);
    for (VisitorInfo visitorInfo : visitorList) {
        System.out.println(visitorInfo);
        visitorInfoService.sa ve(visitorInfo);
    }
    return new VisitorInfo(1, "dd", "bb", new Date(), 1, 2);
}

方法直接接收一个BatchVisitor对象，SpringMVC框架会自动将前端名为“visitorList[0]”、“visitorList[1]”的表单数据映射到该对象内的集合中。看，这样一来，批量接收的问题就迎刃而解了。

不过，当你想用@ResponseBody将自定义对象（比如上面方法返回的VisitorInfo）直接响应为JSON时，可能会遇到第一个障碍——页面报错。这是因为SpringMVC默认需要额外的库来处理对象与JSON之间的转换。解决办法很简单，在项目的pom.xml中添加Jackson依赖：

    com.fasterxml.jackson.core
    jackson-databind
    2.9.6

依赖问题解决后，下一个挑战是日期处理。前端传递的日期字符串，后端如何正确转换为Date对象？通常有两种主流方案：一种是配置全局的MVC自定义日期转换器；另一种更轻量，直接在实体类的日期字段上使用@DateTimeFormat注解，指定匹配的前端格式。

你以为这就结束了？还有一个“隐秘的角落”：即使后端能正确接收日期，当你把包含Date字段的对象用@ResponseBody返回成JSON时，你可能会发现日期变成了一长串数字（时间戳）。这并非错误，而是Jackson的默认序列化行为。如果希望它以“yyyy-MM-dd”这样的友好格式出现，就需要对Jackson进行配置，告诉它如何格式化日期。

上面几张图具体展示了解决日期响应格式问题的几种配置方式，比如在application.properties中配置全局格式，或者在实体类的日期字段上使用@JsonFormat注解。把这些点都处理好，一个健壮、友好的SpringMVC Ajax批量新增功能才算真正完成。