通过AJAX传递数组至C#后端方法时参数值为空但数组计数正常的问题排查

嘿，这问题我之前也踩过坑！核心原因是前后端的数据类型完全不匹配，导致模型绑定出了问题——你前端传的是包含多个对象的数组，但后端用List<string>去接收，这俩根本不对口啊！

为什么会出现“计数正常但每个值都是null”的情况？因为AJAX确实把数组的长度传递过去了，但每个元素是带key1/key2/key3的对象，没法直接转换成string类型，所以后端的List里每个位置只能是null，但数组的长度是对的。

接下来给你一步步解决：

1. 定义匹配的C#实体类 #

首先要在后端创建一个和前端对象结构完全对应的类，这样模型绑定才能正确映射每个属性：

public class TestItem
{
    // 属性名用帕斯卡命名（首字母大写）没问题，ASP.NET会自动映射前端的驼峰命名
    public string Key1 { get; set; }
    public string Key2 { get; set; }
    public string Key3 { get; set; }
}

2. 修改后端方法的参数类型 #

把原来的List<string>改成List<TestItem>，别忘了加上[HttpPost]特性（确保路由能正确匹配POST请求）：

[HttpPost]
public JsonResult testhere(List<TestItem> test)
{
    // 现在调试的时候就能看到test里每个元素的Key1/Key2/Key3都有值啦
    return Json("处理成功");
}

3. 调整前端AJAX请求 #

jQuery的$.ajax默认会把对象转成application/x-www-form-urlencoded格式发送，这种格式对复杂对象（比如对象数组）的支持不好，所以我们要改成发送JSON字符串，并指定正确的Content-Type：

let test = $('.divtest').map(function (index, element) { 
  return { 
    key1: $(element).closest('.testdiv')[0].id, 
    key2: $(element).attr('id'), 
    key3: $(element).attr('style') 
  } 
}).get();

$.ajax({ 
  cache: false, 
  type: "POST", 
  // 把数据序列化成JSON字符串
  data: JSON.stringify({ test: test}), 
  dataType: "json", 
  // 必须指定这个，告诉后端我们发的是JSON格式数据
  contentType: "application/json", 
  url: "/controller/testhere", 
  success: function (result) { 
    alert('done'); 
  } 
});

额外注意点 #

• 如果你的项目是ASP.NET MVC（不是Core），可能需要在web.config里配置JSON序列化的相关设置，确保能正确解析驼峰命名的属性。
• 可以检查前端的key名称（比如key1）和后端实体类的属性名称（Key1）是否对应，ASP.NET默认会自动处理驼峰和帕斯卡命名的映射，如果你想严格一致，也可以把后端属性改成小写的key1。

内容的提问来源于stack exchange，提问作者jack