如何通过AJAX传递JSON对象跳转至新的MVC视图？

你用AJAX发起请求的方式本身就错了——AJAX的设计目的是异步获取数据而不刷新/跳转整个页面。控制器返回的详情页HTML会被AJAX接收在success回调的data参数里，但AJAX不会自动帮你完成页面跳转，所以你看不到任何页面变化。

方案1：用表单POST提交（符合MVC页面跳转的常规逻辑） #

既然要跳转页面，完全没必要用AJAX，直接通过隐藏表单把行数据提交给控制器即可：

1. 在页面添加隐藏表单：

<form id="empDetailForm" action="/Employees/GetEmployeeByObject" method="POST">
    <input type="hidden" id="empData" name="emp" />
</form>

2. 修改点击事件的JS代码：

$('#employee_table tbody').on('click', '.editLink', function () {
    var emp = employee_table.row($(this).parents('tr')).data();
    // 将行数据转为JSON字符串存入隐藏输入框
    $('#empData').val(JSON.stringify(emp));
    // 提交表单触发页面跳转
    $('#empDetailForm').submit();
});

3. 优化控制器代码（让模型绑定自动处理参数）：

[Route("Employees/GetEmployeeByObject")]
[HttpPost] // 明确标记为POST请求
public IActionResult GetEmployeeByObject(string emp)
{            
    EmployeeDTO dto = JsonConvert.DeserializeObject<EmployeeDTO>(emp);
    EmployeeDetailViewModel employeeDetailViewModel = new(dto);
    return View(employeeDetailViewModel);                
}

方案2：用AJAX获取HTML后替换页面内容（不跳转，仅替换内容） #

如果不想跳转页面，只想把当前页面内容替换为详情页，可以在success回调里处理：

$('#employee_table tbody').on('click', '.editLink', function () {
    var emp = employee_table.row($(this).parents('tr')).data();
    $.ajax({
        url: "/Employees/GetEmployeeByObject/",
        type: 'POST',
        contentType: "application/json; charset=utf-8",
        data: JSON.stringify(emp),
        success:  function(data){
            // 替换整个页面的body内容（或指定容器）
            $('body').html(data);
        }
    });
});

⚠️ 注意：这种方式不会修改浏览器URL，后退按钮可能出现异常，仅适合特殊场景。

• 确保控制器路由和请求URL完全匹配：比如控制器用[Route("Employees/GetEmployeeByObject")]，JS里的请求地址就要对应/Employees/GetEmployeeByObject。
• 控制器方法必须加[HttpPost]特性，否则可能出现路由匹配失败的问题。

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