前后端不分离,form前端表单提交,springboot后端list接收

前端JS

javascript 复制代码
var data= $("#form-xxx").serializeArray();
var config = {
	url: url,
	type: "post",
	dataType: "json",
	data: data,
	beforeSend: function () {
		$.modal.loading("正在处理中,请稍后...");
	},
	success: function(result) {
		if (typeof callback == "function") {
			callback(result);
		}
		$.operate.successTabCallback(result);
	}
};
 $.ajax(config)

前端 thymeleaf的html

html 复制代码
<form th:each="tb,tbState : ${tables}">
<input
th:id="${#strings.concat('tableName',tbState.index)}"
th:name="${#strings.concat('data[',tbState.index,'].tableName')}"
th:value="${tb.tableName}"
type="hidden"  />

</form>

form里循环生成 input

name标签值为 data[i].xxx

java 后端接口

POST 接收对象的定义

java 复制代码
List<XxxxDTO> data

XxxxDTO 的属性对应单次input循环的name 的命名

相关推荐
老华带你飞6 小时前
实习记录小程序|基于SSM+Vue的实习记录小程序设计与实现(源码+数据库+文档)
java·数据库·spring boot·小程序·论文·毕设·实习记录小程序
my_styles6 小时前
docker-compose部署项目(springboot服务)以及基础环境(mysql、redis等)ruoyi-ry
spring boot·redis·后端·mysql·spring cloud·docker·容器
编程、小哥哥7 小时前
互联网大厂Java面试:从Spring Boot到微服务架构的技术深挖
java·spring boot·redis·微服务·prometheus·面试技巧
caihuayuan59 小时前
生产模式下react项目报错minified react error #130的问题
java·大数据·spring boot·后端·课程设计
一只码代码的章鱼9 小时前
Spring Boot- 2 (数万字入门教程 ):数据交互篇
spring boot·后端·交互
编程、小哥哥9 小时前
Java大厂面试:从Web框架到微服务技术的场景化提问与解析
java·spring boot·微服务·面试·技术栈·数据库设计·分布式系统
苹果酱056711 小时前
React方向:react脚手架的使用
java·vue.js·spring boot·mysql·课程设计
编程乐学(Arfan开发工程师)12 小时前
07、基础入门-SpringBoot-自动配置特性
java·spring boot·后端
会敲键盘的猕猴桃很大胆12 小时前
Day11-苍穹外卖(数据统计篇)
java·spring boot·后端·spring·信息可视化
编程、小哥哥13 小时前
互联网大厂Java面试场景:从Spring Boot到分布式缓存技术的探讨
spring boot·redis·微服务架构·数据库连接池·java面试·分布式缓存·音视频场景