jQuery的ajax 方法提交多个对象数组问题 C# traditional $.param
当用$.ajax()向后台提交参数时,如果参数中数组的话一般在后台会用List<T>接收;但老是不成功如下面代码
var arr1=[{ "aa": "", "bb": "" }, { "aa": "", "bb": ""}];
var arr2=[{ "aa": "", "bb": "" }, { "aa": "", "bb": ""}];
function addUser(){
$.ajax({
url:'UserAdd',
data:{list1:arr1,list2:arr2},
type:'post',
success:function(msg){
if(msg==''){
console.log('添加成功');
}else{
console.log('添加失败')
}
}
});
}
用Fiddler 监测之后发觉数据变成啦
list1[][aa]=&list1[][bb]=&list1[][aa]=&list1[][bb]=&list2[][aa]=&list2[][bb]=&list2[][aa]=&list2[][bb]=
C#中能识别的数组应该是这样的格式
list1[].aa=&list1[].bb=&list1[].aa=&list1[].bb=&list2[].aa=&list2[].bb=&list2[].aa=&list2[].bb=
在网上查找资料之后了解到ajax post之前会用因为jQuery需要调用jQuery.param序列化参数,我们来看下jquery源码
//在ajax()方法中,对json类型的数据进行了$.param()处理
if ( s.data && s.processData && typeof s.data !== "string" ) {
s.data = jQuery.param( s.data, s.traditional );
} //param方法中
if ( jQuery.isArray( a ) || ( a.jquery && !jQuery.isPlainObject( a ) ) ) {
// Serialize the form elements
jQuery.each( a, function() {
add( this.name, this.value );
}); } else {
// If traditional, encode the "old" way (the way 1.3.2 or older
// did it), otherwise encode params recursively.
for ( prefix in a ) {
buildParams( prefix, a[ prefix ], traditional, add );
}
}
找到原因之后就好办啦
首先,traditional为false,我们可以通过设置traditional 为true阻止深度序列化
先写一个数组转为对象的方法:
Array.prototype.serializeObject = function (lName) {
var o = {};
$t = this;
for (var i = 0; i < $t.length; i++) {
for (var item in $t[i]) {
o[lName+'[' + i + '].' + item.toString()] = $t[i][item].toString();
}
}
return o;
};
var arr1=[{ "aa": "1", "bb": "2" }, { "aa": "3", "bb": "4"}];
var arr2=[{ "aa": "1", "bb": "2" }, { "aa": "3", "bb": "4"}];
function addUser(){
$.ajax({
url:'UserAdd',
data:$.param(arr1.serializeObject("list1"))+"&"+$.param(arr2.serializeObject("list2"), //手动把数据转换拼接
type:'post',
traditional:true, //这里必须设置
success:function(msg){
if(msg=='1'){
console.log('添加成功');
}else{
console.log('添加失败')
}
}
});
}
C#后台接收代码
public class Test
{
public int aa{ get; set; }
public int bb{ get; set; }
} public ActionResult UserAdd( List<Test> list1, List<Test> list2)
{ return Json(amm);
}
这样一来问题就解决啦!
jQuery的ajax 方法提交多个对象数组问题 C# traditional $.param的更多相关文章
- jquery中$.ajax方法提交表单
function postdata(){ //提交数据函数 $.ajax({ //调用jqu ...
- jQuery的ajax()方法提交数组问题
http://blog.csdn.net/thc1987/article/details/7278269 解决办法是添加一个属性 traditional:true $.ajax({ type: ...
- ajax系列之用jQuery的ajax方法向服务器发出get和post请求
打算写个ajax系列的博文,主要是写给自己看,学习下ajax的相关知识和用法,以更好的在工作中使用ajax. 假设有个网站A,它有一个简单的输入用户名的页面,界面上有两个输入框,第一个输入框包含在一个 ...
- 关于Jquery中ajax方法data参数用法的总结
data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...
- 前端-jQuery的ajax方法
https://www.cnblogs.com/majj/p/9134922.html 0.什么是ajax AJAX = 异步的javascript和XML(Asynchronous Javascri ...
- jquery 通过submit()方法 提交表单示例
jquery 通过submit()方法 提交表单示例: 本示例:以用户注册作为例子.使用jquery中的submit()方法实现表单提交. 注:本示例仅提供了对表单的验证,本例只用选用了三个字段作为测 ...
- 重写jquery的ajax方法
//首先备份下jquery的ajax方法 var _ajax=$.ajax; //重写jquery的ajax方法 $.ajax=function(opt){ //备份opt中error和success ...
- jquery通过ajax方法获取json数据不执行success
1.jquery通过ajax方法获取json数据不执行success回调 问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准 ...
- jquery通过ajax方法获取json数据不执行success回调
问题描述:jquery通过ajax方法获取json数据不执行success回调方法 问题原因:json格式存在问题或不符合标准写法,导致总是执行error回调方法 解决方案:使json格式务必符合下述 ...
随机推荐
- MariaDB远程连接配置
由于MariaDB是由MySQL的一个分支发展起来的,二者的配置也大体相同. wex@localhost:~# mysql -uroot -proot 进入MariaDB服务器,将mysql.user ...
- Centos6.7下安装配置VPN
在Vultr上买了台VPS准备做VPN,不贵5刀,位置是日本东京的.ping值在100-200之间,还好算说的过去. Vultr地址 系统选择的Centos6 的版本是6.7 在网上查了查linux下 ...
- Session为null无法访问
我们在一般处理程序中需要访问Session为null 无法访问和操作 处理方案: 1.导入命名空间 System.Web.SessionState 2.实现IRequiresSessionState ...
- Kali Linux Web 渗透测试视频教程— 第四课 google hack 实战
Kali Linux Web 渗透测试— 第四课 google hack 实战 文/玄魂 目录 shellKali Linux Web 渗透测试— 第四课 google hack 实战 课程目录 Go ...
- [游戏模版4] Win32 显示鼠标位置
>_<:use MOUSE_MOVE message refresh the position information. >_<:use LOWORD(lParam) get ...
- jQuery document window load ready 区别详解
用过JavaScript的童鞋,应该知道window对象和document对象,也应该听说过load事件和ready事件,小菜当然也知道,而且自认为很了解,直到最近出了问题,才知道事情并不是那么简单. ...
- AngularJS应用页面切换优化方案
葡萄城的一款尚在研发中的产品,对外名称暂定为X项目.其中使用了已经上市的Wijmo中SpreadJS产品,另外,在研发过程中整理了一些研发总结分享给大家.如本篇的在页面切换的过程中优化方案,欢迎大家跟 ...
- [BTS] BizTalk EDI AS2 Error 1
A message sent to adapter "HTTP" on send port "XZ.Test.AS2" with URI "https ...
- atitit.web ui 结构建模工具总结
atitit.web ui 结构建模工具总结 1. 王者.dreamweaver 1 2. Frontpage/SharePoint Designer(FrontPage) 2010... 1 3. ...
- Java插件开发-取插件下的某个文件
//找到插件所在处 Bundle bundle = Activator.getDefault().getBundle(); //根据插件转义成URL路径 URL url = FileLocator.t ...