| 
                         想到在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,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", 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对象有多少复杂都没关系,他会自动转换为服务端要求的格式,服务端再也不用操心了。                         (编辑:莱芜站长网) 
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! 
                     |