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格式务必符合下述 ...
随机推荐
- WPF ToolKit Chart 自定义样式
1.引用:WPFToolkit.dll, System.Windows.Controls.DataVisualization.Toolkit.dll 2. 页面代码参考如下: <UserCont ...
- why add \n to http response.responseText
这是今天我们公司线上出现的问题,http response 的信息,都添加了一个\n换行,我找了好久呢 才发现,我把php页面的结束符?>去掉之后,一切正常,这个?>,我平时也是很少加上的 ...
- windowsXP用户被禁用导致不能网站登录
1.查看系统事件,发现弹出如下的错误 2.根据上面的错误,我们很容易就可以判断是禁用了账户引起的 2.1后面进入计算机管理,再进入用户管理 2.2双击点开Internet来宾用于,发现此用户已经停用了 ...
- [MFC] MFC 打开HTML资源(用ID版,也可加载到自己的web控件上)
@ ^ @:如果是加载到web控件上,就把注释掉的解除注释(改为web控件点后面的函数),把下一句注释 BOOL Button::LoadFromResource(UINT nRes){//打开网页加 ...
- JsRender for index 循环索引使用说明
循环是模版引擎必不可少的一部分,而说起循环,会引出一个至关重要的因素:索引. 所谓索引,即循环次数,通过索引,可以获取当前循环是第几次. 如果读者阅读过官方文档,会见到如下获取索引的方式: data: ...
- Apache CXF Webservice入门
1.步骤一览 关于CXF的介绍请移步官网.百科,这里仅供初次使用者入门. 2.步骤详情 2.1.环境准备 apache-cxf-3.0.0.zip下载 jdk1.7.0_51 Eclipse4.3.0 ...
- 使用jQuery和CSS3生成的搜索框变形全屏搜索效果
在线演示 本地下载 使用jQuery和CSS3过渡变形效果生成的一个搜索框变形效果实现,可以帮助你更好利用页面格式和内容.实验性质的代码,请大家在产品环境里自己修改使用!
- Atitit..文件上传组件选型and最佳实践总结(3)----断点续传控件的实现
Atitit..文件上传组件选型and最佳实践总结(3)----断点续传控件的实现 1. 实现思路:::元插件,元设置... 1 2. 实现流程downzip,unzip,exec 1 3. Zip ...
- 更新日志 - fir.im 主题壁纸来了
fir.im 产品开发团队最近主要在优化应用管理后台和 BugHD 后台,新版应用管理后台很快会与大家见面. 本周其他更新内容简单概述如下: 1.fir.im 工具页添加壁纸主题包 有很多用户很喜欢 ...
- SAP大数据为"海上F1"提供技术支持
“海上F1”的2014极限帆船赛在青岛开赛,这场大赛是技术与体育高度融合的盛会.比赛中,每一个船员将使用各种高新技术,应尽所能,战胜对手.很多人之所以喜欢这样的比赛,是因为帆船比赛是世界上最复杂的一项 ...