使用jQuery将数据发布到MVC操作方法
我正在尝试使用下面的方法使用jQuery Ajax将数据发布到MVC操作。 但是在控制器内部，所有模型属性始终为null 。 不知道我在这里缺少什么。
.CSHTML
JavaScript的
$(function () { $("#Save").click(function (e) { var dataToPost = $("#MyForm").serialize() $.ajax( { type: "POST", data: JSON.stringify(dataToPost), url: "Working/Save", contentType: 'application/json; charset=utf-8' }) }) })
调节器
public class WorkingController : Controller { // GET: Working public ActionResult Index() { return View(); } public ActionResult Save(WorkingModel model) { // All model properties are null here???? return Json("Success"); } }
模型
public class WorkingModel { public string PersonName { get; set; } public string Address { get; set; } public string[] States { get; set; } public string Status { get; set; } }
EDIT1
我已经添加了上面的模型。 这里，当我点击保存时，序列化数据和JSON stringify数据。
序列化数据
"PersonName=Foo&Address=123+Test+Drive&States=TX&Status=1"
在JSON.Stringify之后
"\"PersonName=Foo&Address=123+Test+Drive&States=TX&Status=1\""
我试过添加HttpPost属性和[FromBody]属性没有运气。
我认为我不必将ActionResult的返回类型更改为JsonResult 。
此外，URL是正确的，因为调试器正在我可以QuickWatch模型属性的action方法中。
请注意，如果我创建JSON对象并将其发布如下，则它可以工作：
var dataToPost = { PersonName:'Foo', Address: '123 Test Drive', State: 'TX', Status: 1 }
您的JavaScript / jQuery代码可以大大简化，这可能是最佳选择：
$(function () { $("#MyForm").on('submit', function (e) { e.preventDefault() // prevent the form's normal submission var dataToPost = $(this).serialize() $.post("Working/Save", dataToPost) .done(function(response, status, jqxhr){ // this is the "success" callback }) .fail(function(jqxhr, status, error){ // this is the ""error"" callback }) }) })
您应该处理表单的onsubmit事件，而不是按钮的onclick事件 – 除按钮之外的其他内容可能会导致提交表单。 在这种情况下，我们希望阻止表单的默认提交行为，因为我们使用AJAX提交表单。
.serialize()已经正确处理对表单的编码，因此您不需要对表单值进行JSON编码。 这样做很可能是模型绑定器在处理请求时没有重建模型的原因。
$.post是一个辅助函数，它包含了$.ajax所需的常用设置工作 – 此处显示的版本需要URL到POST，数据要POST。 如果您的jQuery代码位于View中的脚本元素中，那么您可能希望使用Url.Action()帮助程序 – 它将根据您的路由规则构建正确的URL。 如果你选择去那条路线，你会使用类似的东西：
$.post('@Url.Action("Save", "Working")', dataToPost)
然后，我们使用相关的帮助程序处理成功的响应（任何具有HTTP-200状态代码的响应）和失败的响应（基本上是其他任何东西）。 你在那些助手中所做的事取决于你。
我认为你应该提交标准的HTML表单数据而不是JSON数据。 因此改变线条：
data: JSON.stringify(dataToPost), contentType: 'application/json; charset=utf-8'
至
data: dataToPost, contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
注意：您也可以省略第二行，因为这是$.ajax的默认contentType根据jQuery文档 。
编辑1这是对您的评论和编辑的回应。
我试图告诉您的是，您的Ajax发送的数据必须与您处理行动收到的数据的方式相匹配。 模型属性为null的原因是这两者不匹配。
你没有发布你的行动代码，所以我们不知道你是如何处理数据的，但是现在从你的编辑1中，你似乎正在处理作为JSON数据接收的数据，因为它在你发送它时起作用了真正的JSON数据。
所以你必须做两件事之一：
1-发送真正的JSON数据：简单地使用JSON.stringify并不意味着您的数据现在是适当的JSON数据。 正如您所发现的， JSON.stringify只是用引号将您的字符串包装起来，使其成为有效的JSON字符串，就是这样。 但这不是你的行动所期望的，它期待一个JSON对象。 要发送JSON对象，您可能需要编写一个逐个获取表单字段并构建JSON对象的函数，然后调用此函数而不是JSON.stringify 。
2-发送标准表格数据：这就是我在上面的答案中建议的内容。 要使其工作，只需删除操作中将其作为JSON对象处理的所有代码。 MVC默认设计用于处理标准表单数据，因此您不需要任何其他处理。 只需发送标准表格数据即可。
注意：Ajax不需要以JSON格式发送/接收数据。 JSON格式对于在许多场景中交换数据非常有用，但您选择适合您特定场景的格式。 例如，您的操作是仅为结果发送回JSON对象： return Json("Success") 。 如果您只想发送简单的结果（成功与失败），您可以返回一个简单的字符串（例如return "Success" ）或甚至是布尔/整数（例如return "True"或return "1" ）。 Jason对象需要额外的处理来从字符串中解析它们。 虽然这种处理非常快速有效，但如果您不需要发送其他信息，则解析和处理简单数据类型（如字符串，布尔值或整数）仍然会快一些。
我只需要从post中删除内容类型，不要将其字符串化，并且它有效
$(function () { $("#Save").click(function (e) { var dataToPost = $("#MyForm").serialize() $.ajax( { type: "POST", data: dataToPost, url: "Working/Save" }) }) })
因为我错了，将之前的答案文本移到了pastebin ，答案如下：
刚看完你的编辑，你的问题就是JSON看起来很有趣：“\”PersonName = Foo＆Address = 123 + Test + Drive＆States = TX＆Status = 1 \“”这不会转化为WorkingModel。
我的推荐是创建一个自定义JS对象并发布它。 我刚刚启动了一个VS MVC项目并制作了它，一切正常:)
$(function() { $("#Save").click(function(e) { var personName = $("[name='PersonName']").val(); var address = $("[name='Address']").val(); var states = $("[name='States']").val(); var status = $("[name='Status']").val(); var dataToPost = { PersonName: personName, Address: address, States: states, Status: status }; $.ajax( { type: "POST", data: JSON.stringify(dataToPost), url: "Save", contentType: 'application/json; charset=utf-8' }); }); });
希望这可以帮助！