DataTable使用Ajax向ASP.NET MVC控制器传参无法被接收如何解决

核心问题汇总 #

• 语法错误：你给出的前端DataTable配置中，"data" : ' { ttt: "CO" }'行末尾缺少逗号，会直接导致JS语法报错，Ajax请求无法正常发起。
• GET请求参数传递逻辑错误：GET请求的参数默认通过URL查询字符串传递，ASP.NET MVC的[HttpGet]接口默认从查询字符串绑定参数，你配置了contentType: "application/json;charset=utf-8"且传递JSON序列化字符串的写法不符合GET请求的参数规则，后端无法识别绑定到ttt参数。
• 潜在的JSON返回错误：ASP.NET MVC默认禁止GET请求返回JSON数据，你当前的接口返回JsonResult时没有指定允许GET请求，即使参数传对也会触发运行时错误。

修复步骤 #

1. 前端代码修改 #

删掉不必要的contentType配置，data直接传递普通JS对象，不要序列化，DataTable会自动将对象转为查询字符串参数拼接到请求URL中，修复后的代码如下：

$('#tblVacation').DataTable({
    "ajax": {
        "url": '/Vacation/LoadData2',
        "type": 'GET',
        "dataType": 'JSON',
        "data" : { ttt: "CO" }, // 直接传对象，不要转JSON字符串，补全逗号
        "dataSrc": "",
    },
    "columns": [
        { "data": "vacationId", width: "5%" },
        { "data": "operatorId", width: "3%" },
        { "data": "operator", width: "10%" },
        { "data": "type", width: "3%" },
    ]
});

2. 后端代码修改 #

返回JsonResult时添加JsonRequestBehavior.AllowGet参数，允许GET请求返回JSON：

[HttpGet]
public ActionResult LoadData2(string ttt)
{               
    List<Vacation> data = null;
    try
    {
        data = DB.Vacations.Include(x => x.Operator).ToList();
        var result = data.Select(x => new Vacation_VM
            {
                VacationId = x.VacationId,
                OperatorId = x.OperatorId,
                Vacation_doc = x.Vacation_doc,
                Operator = x.Operator.Name,
                Type = x.Type,                    
            }).Where(m => m.Type == ttt);
        // 增加JsonRequestBehavior.AllowGet允许GET请求返回JSON
        return new JsonResult(result, JsonRequestBehavior.AllowGet);
    }
    catch (Exception ex)
    {
        ViewBag.Message = ex.Message;
    }
    return new JsonResult(null, JsonRequestBehavior.AllowGet);
}

多参数扩展方法 #

后续需要传递多个参数时，直接在前端ajax的data对象中添加对应属性，后端Action中添加同名参数即可自动绑定，示例：
前端配置：

"data" : { 
    ttt: "CO",
    pageSize: 10,
    keyword: "test" 
}

后端适配：

[HttpGet]
public ActionResult LoadData2(string ttt, int pageSize, string keyword)

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