AJAX PUT 请求到 C# 控制器

本文关键字:控制器 请求 PUT AJAX | 更新日期: 2023-09-27 18:36:00

我正在尝试使用 AJAX 请求更新数据库中的记录。我可以使用类似于以下内容的方式插入,但是当我尝试更新或删除时没有成功。

这是我的 ajax PUT 方法:

$('#updateCr').click(function(e) {
    e.preventDefault();
    var updatedData = {
        CrId: $('#CrId').val(),
        CrName: $('#CrName').val(),
        CrStatus: $('#CrStatus').val(),
        CrPriority: $('#CrPriority').val(),
        CrTitle: $('#CrTitle').val(),
        CrDescription: $('#CrDescription').val()
    };
    console.log(changeRequest);
    $.ajax({
        type: "PUT",
        url: "@Url.Action("MyControllerAction", "Home")",
        content: "application/json; charset=utf-8",
        dataType: "json",
        data: updatedData,
        cache: false,
        success: function(d) {
            if (d.success == true)
                window.location = "index.html";
            else {}
        },
        error: function(xhr, textStatus, errorThrown) {
            // TODO: Show error
        }
    });

这是我的控制器

[HttpPut]
public JsonResult MyControllerAction(UpdatedDataObject updatedData)
{
    try
    {
        myModel.UpdateDataMethod(updatedData);
    }
    catch (Exception e)
    {
        var theerrror = e.ToString();
        return Json(new { result = theerrror });
    }
    return Json(new { result = "Success" });
}

提交数据时,控制器被触发,但它没有接收 JSON 对象。我在这里做错了什么?

AJAX PUT 请求到 C# 控制器

问题是错字。返回的 JSON 属性称为 result 。在您的 JS 代码中,您使用 success .另请注意,您发送的是application/x-www-form-urlencoded数据,而不是application/json 。值得庆幸的是,这不是问题,因为ModelBinder将适用于这两种类型的请求。试试这个:

$.ajax({
    type: "PUT",
    url: "@Url.Action("MyControllerAction", "Home")",
    dataType: "json",
    data: updatedData,
    cache: false,
    success: function(d) {
        if (d.result) {
            window.location.assign("index.html");
        } else { 
            console.log('do something constructive with the error here...');
        }
    },
    error: function(xhr, textStatus, errorThrown) {
        // TODO: Show error
    }
});

最后,当 AJAX 请求的结果成功时将用户重定向到另一个屏幕似乎有点多余。如果这是您需要的行为,那么 AJAX 的意义就没有意义了,您也可以使用标准表单提交。

我发现包含JSON.stringify()通常可以为我解决此类问题

data: JSON.stringify(updatedData),

总代码如下所示:

$.ajax({
    type: "PUT",
    url: "@Url.Action("MyControllerAction", "Home")",
    content: "application/json; charset=utf-8",
    dataType: "json",
    data: JSON.stringify(updatedData),
    cache: false,
    success: function(d) {
    if (d.success == true)
    window.location = "index.html";
    else {}
         },
         error: function(xhr, textStatus, errorThrown) {
    // TODO: Show error
  }
});

除了上面提供的内容外,请注意,如果 PUT 和 DELETE 的动词标头不起作用,请参阅此处提供的响应:

ASP.NET Web API - PUT & DELETE Verbs Not Allow - IIS 8

基本上,您所需要的只是:

  <system.webServer>
<validation validateIntegratedModeConfiguration="false" />
<modules runAllManagedModulesForAllRequests="true">
  <remove name="WebDAVModule"/>
  <remove name="FormsAuthentication" />
</modules>
<handlers>
  <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
  <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
  <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
  <add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%'Microsoft.NET'Framework'v4.0.30319'aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
  <add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%'Microsoft.NET'Framework64'v4.0.30319'aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
  <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
</handlers>