asp.net中mvc使用ajax提交参数的匹配问题解决探讨

想到在asp.net的mvc中如果使用ajax向服务端传递参数时如果参数是一个类或者是个数组（或list集合）以及更复杂的对象时，服务端总是会发生取不到值的情况，当然网上也有很多解决的例子，但都是在服务端想办法来解决的（比如将json转换为字符串，再在服务端反序列化为一个对象），为何不能在客户端就把这个问题搞定。

其实问题没那么复杂，那是因为在jquery提交array的数据时，提交的时候始终会在名称后面加上”[]”， 问题就出在这里。另外在服务端对数组和内嵌的js对象进行解析时，需要像这样的格式，比如数组（或list集合）在服务端需要这样{'xxx[0]':'aaa','xxx[1]':'bbb'}的格式，而内嵌对象需要像这样{'xxx.a':'ddd','xxx.b':'hhh'}，找到问题的原因就好解决了，如果我们能将json的格式转换为服务端了能够识别的格式，问题岂不迎刃而解。

说干就干，直接上代码

//用于mvc参数适配javascript闭包函数
/*
使用方式如下：
$.ajax({
url: "@url.action("ajaxtest")",
data: mvcparammatch("", senddata),//在此转换json格式，用于mvc参数提交
datatype: "json",
type: "post",
success:function(result) {
alert(result.message);
}
});
*/
var mvcparammatch = (function () {
var mvcparameteradaptive = {};
//验证是否为数组
mvcparameteradaptive.isarray = function.isarray || function (o) {
return typeof o === "object" &&
object.prototype.tostring.call(o) === "[object array]";
};
//将数组转换为对象
mvcparameteradaptive.convertarraytoobject = function (/*数组名*/arrname, /*待转换的数组*/array, /*转换后存放的对象，不用输入*/saveojb) {
var obj = saveojb || {};
function func(name, arr) {
for (var i in arr) {
if (!mvcparameteradaptive.isarray(arr[i]) && typeof arr[i] === "object") {
for (var j in arr[i]) {
if (mvcparameteradaptive.isarray(arr[i][j])) {
func(name + "[" + i + "]." + j, arr[i][j]);
} else if (typeof arr[i][j] === "object") {
mvcparameteradaptive.convertobject(name + "[" + i + "]." + j + ".", arr[i][j], obj);
} else {
obj[name + "[" + i + "]." + j] = arr[i][j];
}
}
} else {
obj[name + "[" + i + "]"] = arr[i];
}
}
}
func(arrname, array);
return obj;
};
//转换对象
mvcparameteradaptive.convertobject = function (/*对象名*/objname,/*待转换的对象*/turnobj, /*转换后存放的对象，不用输入*/saveojb) {
var obj = saveojb || {};
function func(name, tobj) {
for (var i in tobj) {
if (mvcparameteradaptive.isarray(tobj[i])) {
mvcparameteradaptive.convertarraytoobject(i, tobj[i], obj);
} else if (typeof tobj[i] === "object") {
func(name + i + ".", tobj[i]);
} else {
obj[name + i] = tobj[i];
}
}
}
func(objname, turnobj);
return obj;
};
return function (json, arrname) {
arrname = arrname || "";
if (typeof json !== "object") throw new error("请传入json对象");
if (mvcparameteradaptive.isarray(json) && !arrname) throw new error("请指定数组名，对应action中数组参数名称！");
if (mvcparameteradaptive.isarray(json)) {
return mvcparameteradaptive.convertarraytoobject(arrname, json);
}
return mvcparameteradaptive.convertobject("", json);
};
})();

使用方法非常简单，看下面的例子：
首先是客户端的代码

var senddata = {
"comment": "qqq",
"ajax1": { "name": "sq", "age": 55, "ajax3s": { "ajax3num": 234 } },
"ajax2s": [{ "note": "aaa", "num": 12, "ajax1s": [{ "name": "sq1", "age": 22, "ajax3s": { "ajax3num": 456 } }, { "name": "sq2", "age": 33, "ajax3s": { "ajax3num": 789 } }] },
{ "note": "bbb", "num": 34, "ajax1s": [{ "name": "sq3", "age": 44, "ajax3s": { "ajax3num": 654 } }, { "name": "sq4", "age": 987 }] }]
};


$.ajax({
url: "@url.action("ajaxtest")",
/*
在此使用闭包函数转换json对象，如果你的json对象自身就是个数组array，
那么需要指定一个名称，这个名称对应于action中这个数组参数的名称像这样
　　　　　　　　　　　　data:mvcparammatch(senddata,"action中所对应的参数名称")
*/
data: mvcparammatch(senddata),
datatype: "json",
type: "post",
success:function(result) {
alert(result.message);
},
error:function(a,b,c) {
}
});

然后是服务端对应客户端json的实体类

public class ajaxparammodels
{
public string comment { set; get; }
public ajax1 ajax1 { set; get; }
public list<ajax2> ajax2s { set; get; }
}
public class ajax1
{
public string name { set; get; }
public int age { set; get; }
public ajax3 ajax3s { set; get; }
}
public class ajax2
{
public string note { set; get; }
public int num { set; get; }
public list<ajax1> ajax1s { set; get; }
}
public class ajax3
{
public int ajax3num { set; get; }
}

然后是controller中的action代码

public class testcontroller : controller
{
//
// get: /test/
public actionresult index()
{
return view();
}
public actionresult ajaxtest(models.ajaxparammodels model)
{
//在此可访问model
return json(new {message = "qqqqq"});
}
}

这样就ok了，不管你这个json对象有多少复杂都没关系，他会自动转换为服务端要求的格式，服务端再也不用操心了。