首页 > 解决方案 > 使用 ajax 将数据发布到控制器

问题描述

首先,作为一个win forms开发人员,我在web开发方面没有太多经验。我正在尽我最大的努力掌握它

我有两个表 TOURNAMENTS_M(Master)和 TOURNAMENTS_D(detail),带有脚手架控制器和视图。

我已经编辑了主表创建/编辑视图,以便我也能够显示子记录

在此处输入图像描述

当我按下删除按钮时,我调用以下函数

function DeleteDetail(pId) {
    const con = confirm("are you sure ?");


    if (con === true) {

        $.ajax({
            url: "/TOURNAMENTS_M/Delete",
            type: "POST",
            contentType: "application/json; charset=utf-8",
            data:
                { id: pId }
            })
            .done(function (result) {
                alert("Succeed");
            })
            .fail(function (result) {
                alert("I failed :'( ");
            });

    }
}

但我得到的只是失败消息:(我在这里错过了什么?我真的很感谢任何帮助,我一直在努力让这项工作好几个小时

PS我正在使用mvc核心

更新:

在此处输入图像描述

public async Task<IActionResult> Delete(int? id)
    {
        if (id == null)
        {
            return NotFound();
        }

        var tOURNAMENTS_M = await _context.TOURNAMENTS_M
            .FirstOrDefaultAsync(m => m.TM_ROWID == id);
        if (tOURNAMENTS_M == null)
        {
            return NotFound();
        }

        return View(tOURNAMENTS_M);
    }

这就是我调用函数的方式

@if (Model != null)
{

    var i = 0;
    foreach (var detail in Model.TOURNAMENTS_D)
    {

    <tr>

        <td> <input type='hidden' name="TD_LEVEL" id='@("TD_LEVEL")@i' value="@detail.TD_LEVEL" />@detail.TD_LEVEL </td>

        <td> <input type='hidden' name="TD_SB" id='@("TD_SB")@i' value="@detail.TD_SB" />@detail.TD_SB </td>

        <td> <input type='hidden' name="TD_BB" id='@("TD_BB")@i' value="@detail.TD_BB" />@detail.TD_BB </td>


        <td>
            <a asp-action="Edit" asp-route-id="@detail.TD_ROWID">Edit</a> |

            <button onclick="DeleteDetail(@detail.TD_ROWID) "  class="btn btn-primary">Remove</button>

        </td>
    </tr>
        i++;
    }

    //"<td><a id ='myRemove' data-itemId='0'  class='btn btn-primary'>Remove</a ></td> ";
}

标签: jqueryajaxasp.net-core-mvc

解决方案


正如我在评论中的建议奏效的那样,我将提供更多信息:

由于您使用的是开箱即​​用的 MVC Web Api,它是一个 RESTful API,因此方法类型非常重要。

您正在尝试根据 RESTful API 指南执行需要“删除”类型请求的删除操作。MVC Web Api 将此方法映射到Delete开箱即用的方法,而不使用[HttpDelete]属性。

总的来说,只需将 ajax 调用的方法类型更改为“DELETE”:

function DeleteDetail(pId) {
  const con = confirm("are you sure ?");

  if (con === true) {
     $.ajax({
        ...
        type: "DELETE",
        ...
        });
  }
}

推荐阅读