在MVC应用程序中,Ajax POST参数始终为Null

5

我有一个简单的帖子,在测试应用程序中运行。

控制器代码

public ActionResult Delete(string Id)
{
    ... delete record ...
}

JavaScript
function delAnnouncement(id) {
    $.ajax({
        type: "POST",
        url: "@Url.Action("Delete", "Announcements")",
        contentType: "application/json; charset=utf-8",
        data: JSON.stringify({ "Id": "03d23684-098a-4ae8-8fa2-7d9ce70d63ef" }), // Hard coded for testing
        success: function (data) {
            $("#AnnouncementsPH").replaceWith(data);
        }
    });        
}

我创建了一个简单的测试应用程序,并且它在那里工作。
我正在寻找任何可能导致传递的id始终为空的现有应用程序中存在的想法。
我尝试过以下事项: 路由信息在两个应用程序之间相同。 它们都是安全的https网站。 现有网站上的其他表单按预期工作。这是唯一使用带参数的javascript post的新视图,它只列出任何系统公告。 据我所知,HTML是有效的。 Fiddler显示数据已被发送。 我尝试简单地硬编码传递的Id。
我不知道可能导致“Post”无法工作的原因。
感谢任何建议
编辑1:这是fiddler原始发布
POST https://localhost:44300/Announcements/Delete HTTP/1.1
Host: localhost:44300
Connection: keep-alive
Content-Length: 39
Accept: */*
Origin: https://localhost:44300
X-Requested-With: XMLHttpRequest
Content-TypeOfNotification: application/json; charset=utf-8
User-Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/36.0.1985.125 Safari/537.36
Content-Type: text/plain;charset=UTF-8
Referer: https://localhost:44300/
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8
Cookie: jetbrains.charisma.main.security.PRINCIPAL=NmI4YmFhZTExMThjZDZkZjNmZTBhMDNiZWM4NmY3MDYzZWNiMWE3M2ZmZDM5ODMwYjViMjczN2ZkZmU3YmZlZTpyb290; TCSESSIONID=233EBE63123BA35468235F441F54D7E4; ASP.NET_SessionId=ycnx1ejeyahzipwduux2quqz; __RequestVerificationToken=FnOKGFfBZKEBX4E0KBoV9133e5KK3h9Pd_OjDzNPjv7ifMTMk5uHUPmT621hOQFyOCwW5IhdewKLPDMs2_9jY2vVwrHLYOU9f0F86mN-NoQ1; .AspNet.ApplicationCookie=V8ZnbAx_2_H1Wx946VLcQ235XplzC-uvKdw4CP7Sm8ZVnJu9pG63EuzC0ptOZZNBvzZkRjB0RJS25Pn1WHOzeQSrqoWl87keqRDS6_vMwZ9L6PgKU0rJz7OhD7eKps8l3tzR097zI5WbU_chUZFKLLw1c__rfN3Fy6BbHC1qNtgx0C86AShhG5EsNiruYqJZn-Uj7Z2h75YcZctCFniMyuzD-9RetcMjkN3_PbAJg-_urfntG9NwsMEQdBf1b3K9H3GP_wUYRhnbQdNZpuAkAEa6bVfJiHrnKFhnhLkP8BAfocbMKES1wQKbXBfcNn62cEKUu3On3lHNCNN4zEvOhxF1aDaBk-yghOtvtNkROeFTKMQFD0U-XXAf-RKm0Nwgp1Tb2Ip2U42vshDRNGXQSkOojisVUxiPmkrxDtckNycQd0br1cFSqxfeXyg3cg_vKUP1VMBQcBQxZO6MVLSCDdcpANyoE43IoLp3BHgURJZP88vF18JfVV646XGOZ3QU

Id=03d23684-098a-4ae8-8fa2-7d9ce70d63ef

正如您所看到的,Id已经被提交给控制器,只是没有被解析并提供给方法中的参数。
5个回答

7
你可以追加参数,如下所示:

var targeturl = '@Url.Action("Test", "Controller")?id=' + ID;

$.ajax({
    url: targeturl,
    type: "GET",
    success: function(data) { },
    error: function (data) { }
});

或者您可以直接使用jQuery ajax数据参数:

$.ajax({
  type: "POST",
  url: '@Url.Action("Test", "Controller")',
  data: { id: "your-id" }
})
  .done(function( msg ) {
    alert( "Data Saved: " + msg );
  });

参考文献:http://api.jquery.com/jquery.ajax/

谢谢。Get方法可以正常工作,你有什么想法为什么Post方法不行吗?我已经将此标记为已解决。 - Bob

6
我在其他地方没有找到这个答案,所以我只能通过实验来发现它。
  1. 您将发现,在控制器中,它接收到一个Request.Form对象,如果您查看Request.Form[0],您会发现您的数据。表单中有数据,但MVC将其视为null的原因是POST的表单元素的键是""(空白)。

  2. 因此,在客户端,您必须正确设置内容类型,并在您的数据之前加上"data=" + JSON.stringify(mydata),其中"data"是您要添加的键名。

像这样:

$.ajax({
    type: "POST",
    url: URL,
    data: "data="+JSON.stringify(data),
    contentType: "application/x-www-form-urlencoded; charset=utf-8"

在服务器端,你的[HttpPost]端点必须将一个变量作为输入参数,并且该变量的名称要与你在AJAX中声明的键名相同,例如:
[HttpPost]
[Authorize]
public ActionResult Index (string data) // <-- key name
{
   MyObjectType MyFinalObject = JsonConvert.DeserializeObject<MyObjectType (data);
}

1
我认为你不必使用 JSON.stringify 对数据进行处理。默认情况下,使用ajax发送的值将以json格式发送。
尝试这个。
data : { Id: "03d23684-098a-4ae8-8fa2-7d9ce70d63ef" } 

谢谢,但不幸的是,我得到了相同的结果。我知道如果我创建一个快速应用程序并添加我发布的代码,它确实可以工作,只是在现有的应用程序中无法工作。但我看不出两个应用程序之间会有什么真正的区别,导致它在一个应用程序中能够工作而在另一个应用程序中无法工作。 - Bob

0

对我来说,这些答案都没有起作用,所以我成功地使用了以下方法:

Javascript和JQuery:

function sendAjaxPostRequest(url, id, value) {
    $.post(url+'?id='+id+'&value='+value,
        function (returnedData) {
            console.log(returnedData);
        });
}

C# ASP.NET:

// POST api/<controller>
public void Post(int id, string value)
{
    Console.WriteLine($"{id}: {value}");
}

Post 参数列表签名必须与 POST 请求 URL 匹配,例如 ?id=123 表示必须有一个方法 Post(int id)。希望这能帮助到某些人。

在指责前端 JS 之前,请务必使用 Postman 测试您的后端!


奇怪的是,JS的$.ajax({ ... });单独使用时无法工作,但如果我同时使用JQuery的$.post(...);$.ajax({...}) POST请求,则两者都可以正常工作 - 非常奇怪。


0

我在这上面浪费了将近一天的时间,但最终使用 JQuery 成功让它工作,并确保在继续之前等待响应。客户端脚本如下:

 $.post('/ex/edited/', {
            ExId: @Model.ExId.ToString(),
            ExName: ExName
        })

            .done(function (response) {
                if (response.redirectUrl) {
                    window.location.href = response.redirectUrl;
                } else {
                    alert(response.errorMsg);
                }
            });

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接