【JQuery】Ajax 参数为数组 的方法

9 篇文章 0 订阅
4 篇文章 0 订阅

背景介绍

前端页面为HTML, 后端为Spring
html中根据多选框的值,使用ajax请求接口动态加载其他元素的选项值。

代码

		// select 下拉多选框的值
		var idCardType = $("#idCardType").val();
		// ['2075', '2077', '2078']
		$.ajax({
			url : url,
			type : "post",
			dataType : "json",
			traditional: true,
			data : {
				"idCardType" : idCardType
			},
			success : function(data) {

			},
			error : function() {
				showMessage("获取部门信息失败,请重试!");
			}
		});

接口:

	@RequestMapping("/url")
	@ResponseBody
	public JSONArray getTreeDataByUser(String idCardType) {
		JSONArray array = new JSONArray();
		System.out.println("idCardType:" + idCardType);
		// idCardType:2075,2077,2078
		return array;
	}

总结

traditional:是否使用传统的方式浅层序列化。
数组或jQuery对象会按照name/value对进行序列化,普通对象按照key/value对进行序列化。
通过ajax提交数组时,会自动在所设定的参数后面增加中括号:“[]”,导致后端spring MVC中的@RequestParam获取不到参数。

解决方法:
ajax请求时增加:traditional: true 就可以正常提交了。原因如下:
jQuery会调用jQuery.param序列化参数,jQuery.param( obj, traditional ),默认的话,traditional为false,即jquery会深度序列化参数对象,以适应如PHP和Ruby on Rails框架,但servelt api无法处理,我们可以通过设置traditional 为true阻止深度序列化。

如果不加 traditional: true
在这里插入图片描述
加上 traditional: true
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在.NET Core 6 MVC项目中使用jQuery发起ajax post请求并携带数组参数,可以按照以下步骤进行操作: 1. 创建一个视图,包含一个表单和一个提交按钮。 ```html <form id="myForm" method="post"> <input type="text" name="name" /> <input type="text" name="age" /> <input type="button" id="btnSubmit" value="提交" /> </form> ``` 2. 编写jQuery代码,使用`$.ajax`方法发起post请求,并携带数组参数。 ```javascript <script> $("#btnSubmit").click(function () { var data = { "names": ["Tom", "Jerry"], "ages": [12, 16] }; $.ajax({ type: "POST", url: "/Home/PostData", data: data, success: function (result) { console.log(result); } }); }); </script> ``` 3. 在控制器中创建一个接收post请求的方法,并使用`[FromBody]`特性将请求体中的数据绑定到C#对象上。 ```csharp [HttpPost] public IActionResult PostData([FromBody]MyViewModel myViewModel) { // 处理请求数据 return Json(new { success = true }); } public class MyViewModel { public string[] Names { get; set; } public int[] Ages { get; set; } } ``` 注意事项: - jQuery的`$.ajax`方法中,`data`参数可以直接使用JavaScript对象,jQuery会自动将其转换为适当的格式。 - 在控制器方法中,需要使用`[FromBody]`特性将请求体中的数据绑定到C#对象上。 - 在控制器方法中,可以返回Json数据,使用`Json`方法即可。 以上就是.NET Core 6 MVC项目中使用jQuery发起ajax post请求并携带数组参数方法

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值