如何序列化模型，将其传递给 ajax 请求中的 MVC 控制器

Posted 2023-03-05

【中文标题】如何序列化模型，将其传递给 ajax 请求中的 MVC 控制器

【英文标题】：How to serialize model, pass it to MVC controller in ajax request

【发布时间】：2014-09-16 15:28:52

【问题描述】：

我正在尝试将我的页面模型传递给我的控制器进行处理。 处理完信息后，想更新id为“savedText”的div，显示“账单信息保存成功”。

我有这个想法

function testingFunction() 
    var obj = $('testForm').serialize();

    $.ajax(
        url: '@Url.Action("TestingFunction", "BuildGiftCard")',
        dataType: 'json',
        success: function (result) 
            $("#savedText").html(result);
        ,
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify(obj)
    );

    return false;

我的控制器中有这个：

[HttpPost]
public JsonResult TestingFunction(PurchaseModel model)

    return Json("Billing information saved successfully.");

我做错了什么？

在 chrome 中“检查元素”时，在网络选项卡中，表示找不到我的控制器方法。

另外，对我来说，将整个模型从视图中获取到控制器的函数（在本例中为 TestingFunction）很重要，这样我就可以获取表单信息并保存它。我正在尝试 .serialize() 函数，但这会导致 obj = (空字符串)。

【问题讨论】：

你应该使用 either serialize() 或 JSON.stringify() 但不能同时使用。由于您使用的是表单，请不要更改 contentType，也不要JSON.stringify()它。

但是当我在 chrome 中输入 serialize() 并调试时，结果是空字符串。如何获取表格信息？我检查了，我的表单 ID 正确。它不会拉回任何东西。

您没有正确使用 jQuery 选择器。请阅读Jason P的回答。

一切正常，只是功能没有受到影响。我从 chrome 网络检查中得到这个：POST localhost/BuildGiftCard/TestingFunction 404 (Not Found)

我实际上是在 ajax 方法的 URL 部分拼错了控制器名称。我改变了它，现在我得到一个不同的错误：异常详细信息：System.ArgumentException：无效的 JSON 原语：GiftCardStep2.SelectedInfoPanel

【参考方案1】：

三件事：

$('testForm') 应该是 $('.testForm') 或 $('#testForm')。因为您正在尝试选择<testForm></testForm>。 如果您只是发送表单，则不需要是 json。 尝试发出post 请求：

---

$.ajax(
    url: '@Url.Action("TestingFunction", "BuildGiftCard")',
    dataType: 'json',
    success: function (result) 
        $("#savedText").html(result);
    ,
    data: $('#testForm').serialize(),
    type: 'POST'
);

【讨论】：

您的答案中的第 1 位修复了空表单的问题。所以谢谢。但是它仍然说找不到post方法。

如果您删除[HttpPost] 属性并在浏览器中访问该网址，它会返回404 吗？

我实际上是在 ajax 方法的 URL 部分拼错了控制器名称。我改变了它，现在我得到一个不同的错误：异常详细信息：System.ArgumentException：无效的 JSON 原语：GiftCardStep2.SelectedInfoPanel。

你还在设置json的contentType吗？听起来 jquery 正在发送序列化的表单，但服务器正在尝试反序列化 json。

是的，我正在设置内容类型。不知道为什么它不起作用。它不喜欢我序列化表单的方式。这就是通过序列化表单将模型从 jquery 传递到控制器的方式吗？