ajax-传递map集合,springboot接收参数

一,需求如下

1.前端js封装map对象,通过ajax发起请求,后端通过springboot进行参数的处理

二,js前端数据结构,其中id为业务中的指标编号

var map = {};
var obj = {
					leaderId : leaderId,
					uuid : uuid,
					quotaId:id,
					scroe:parseInt(scroe)+1,
		   }
map[id] = obj;

ajax部分代码,关键部分为maoJson:map,

$.ajax({
				type : "POST",
				dataType : "json",
				url : "/user/noNameSubmit",
				data : {
					gid: gid,
					mapJson: map,
					yearDetailId:yearDetailId,
				},
				async : false,
				success : function(data) {
					alert(data)
			});

二,后台controller层代码,说明:quotaIdIndex = quotaIdIndex.substring(8, 13); 这一段获取quotaId指标编号 业务中指标编号为5位,与前端封装的quotaId对应

/**
	 * 获取领导成员评分明细
	 * 
	 * @param fdusername
	 * @return
	 */
	@PostMapping("/user/noNameSubmit")
	@Transactional
	public @ResponseBody ResponseBase noNameSubmit(HttpServletRequest request,String gid,String yearDetailId) {
		Enumeration<String> enuq = request.getParameterNames();
		List<String> listQuotaId = new ArrayList<String>();
		while (enuq.hasMoreElements()) {
			String name = (String) enuq.nextElement();
			// 获取quotaId 封装成 集合再遍历
			if (name.contains("quotaId")) {
				listQuotaId.add(name);
			}
		}
		List<LeaderQuotaJson> listQuotaJsons = new ArrayList<LeaderQuotaJson>();
		// 获取quotaId 封装成 集合再遍历
		for (int i = 0; i < listQuotaId.size(); i++) {
			String quotaIdIndex = listQuotaId.get(i);
			quotaIdIndex = quotaIdIndex.substring(8, 13);
			Integer leaderId = Integer.parseInt(request.getParameter("mapJson[" + quotaIdIndex + "][leaderId]"));
			String uuid = request.getParameter("mapJson[" + quotaIdIndex + "][uuid]");
			Integer quotaId = Integer.parseInt(request.getParameter("mapJson[" + quotaIdIndex + "][quotaId]"));
			Integer scroe = Integer.parseInt(request.getParameter("mapJson[" + quotaIdIndex + "][scroe]"));
			LeaderQuotaJson leaderQuotaJson = new LeaderQuotaJson(leaderId, uuid, quotaId, scroe);
			listQuotaJsons.add(leaderQuotaJson);
		}
		//循环调用插入方法
		for (LeaderQuotaJson leaderQuotaJson : listQuotaJsons) {
			iSysIndexService.saveQuotaComment(leaderQuotaJson.getLeaderId(), leaderQuotaJson.getUuid(), "",
					leaderQuotaJson.getQuotaId(), leaderQuotaJson.getScroe(),yearDetailId);
		}
		return setResultSuccess("提交成功");
	}

三,原理说明

代码中业务代码较多,这里简单说明一下实现的原理,前端,实际上使用的数组,var map={}  数据结构的存储效果类似于java中的map集合,同一key后插入的数据会替换之前的数据;

后端也在网上找了很多框架接收map集合的方法,都未实现成功,决定用最原始的request中获取对象,进行分析和重新封装,并与业务进行结合,第一步获取map中的所有key值

Enumeration<String> enuq = request.getParameterNames();
		List<String> listQuotaId = new ArrayList<String>();
		while (enuq.hasMoreElements()) {
			String name = (String) enuq.nextElement();
			// 获取quotaId 封装成 集合再遍历
			if (name.contains("quotaId")) {
				listQuotaId.add(name);
			}
		}

第二步,从request.getParameter("mapJson[" + quotaIdIndex + "][leaderId]")获取对应参数的值即可,其中mapJson为js中传入参数的参数名称

 

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在前端使用ajax向Spring Boot接口传递参数可以按照以下步骤进行: 1. 在前端页面中使用ajax发送请求,可以使用jQuery库中的ajax函数,代码如下: ``` $.ajax({ url: "/api/example", type: "POST", data: {param1: "value1", param2: "value2"}, success: function(result) { console.log(result); }, error: function(xhr, status, error) { console.log(error); } }); ``` 2. 在Spring Boot后端接口中定义一个POST请求的接口,并使用@RequestBody注解接收前端传递参数,代码如下: ``` @RestController @RequestMapping("/api") public class ExampleController { @PostMapping("/example") public ResponseEntity<String> example(@RequestBody Map<String, String> params) { String param1 = params.get("param1"); String param2 = params.get("param2"); // 处理业务逻辑 return new ResponseEntity<>("success", HttpStatus.OK); } } ``` 在上述代码中,@PostMapping注解指定了该接口接收的请求方式为POST,@RequestBody注解指定了该接口接收参数类型为Map<String, String>,通过params.get方法可以获取前端传递参数值。 需要注意的是,在使用ajax发送POST请求时,需要设置请求头Content-Type为application/json,代码如下: ``` $.ajax({ url: "/api/example", type: "POST", contentType: "application/json", data: JSON.stringify({param1: "value1", param2: "value2"}), success: function(result) { console.log(result); }, error: function(xhr, status, error) { console.log(error); } }); ``` 通过以上步骤,就可以实现前端使用ajax向Spring Boot接口传递参数了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值