mvc action 方法调用 begin form 方法，即使它返回 json 给另一个 action 方法

Question

您好，我目前正在开发 MVC Razor。这是场景。谁能有解决方案？我在 BeginForm 中有一个网络网格。

 @using(Html.BeginForm("AllocationOnlyEdit", "AllocationModel", FormMethod.Post, new {
  block = @Model.block
 })) {
  if (Model != null) {
   var grid = new WebGrid(rowsPerPage: Model.RecordsPerPage);
   grid.Bind(Model.AllocModelsListView, autoSortAndPage: false, rowCount: Model.NumberOfRecords); < div class = "wrap" >
    < div id = "gridContent" >
    @grid.GetHtml(
     htmlAttributes: new {
      id = "gdvsearch"
     },
     fillEmptyRows: false,
     tableStyle: "mGrid",
     columns: new [] {
      grid.Column(header: null, canSort: false, format: @ < text > < input id = "ChkDelete_@item.AllocId"
        onclick = "javascript: DeleteCheckBox(this)"
        name = "ChkDelete_@item.AllocId"
        class = "delete-chkbox"
        type = "checkbox"
        value = "@item.AllocId" / > < /text>),
        grid.Column("AllocYear", header: "Year", format: @ < input name = "AllocYear_@item.AllocId"
         id = "AllocYear"
         type = "text"
         style = "font-weight:bold;width:50px;"
         value = "@item.AllocYear"
         disabled = "disabled"
         title = "@item.AllocYear"
         class = "editY-mode" / > ),

        grid.Column("AllocPercentage", header: "Percentage", format: @ < input name = "AllocPercentage_@item.AllocId"
         id = "AllocPercentage_@item.AllocId"
         type = "text"
         style = "font-weight:bold;width:50px;"
         value = "@item.AllocPercentage"
         disabled = "disabled"
         title = "@item.AllocPercentage"
         class = "editPer-mode" / > ),
        grid.Column("LocationDesc", header: "Location", format: @ < input name = "LocationDesc_@item.AllocId"
         id = "LocationDesc_@item.AllocId"
         type = "text"
         style = "font-weight:bold;width:50px;"
         value = "@item.LocationDesc"
         disabled = "disabled"
         title = "@item.LocationDesc"
         class = "editPer-mode" / > ) 

网格在同一次点击时同时执行多个操作（添加/更新/删除）。因此，下面的 javascript 循环并为要编辑/添加/删除的所有网格行调用 action 方法。

  $.ajax({
 type: "GET",
 contentType: "application/json; charset=utf-8",
 url: '@Url.Action("DeleteAndSaveAtSameTimeModels")',
 data: {
  "AllocId": AllocId,
  "Allocpercentage": Allocpercentage,
  "sumtrans": sumtrans,
  "tempsumtrancs": tempsumtrancs,
  "Location": Location,
  "rowCount": rowCount
 },
 dataType: "json",
 beforeSend: function() {},
 success: function(data) {
  debugger;
  tempsumtrancs++;
  if (data.sumtrans == tempsumtrancs) {
   window.location.href = data.result;
  }
 }
});

如果要删除3行并添加1行，则应调用动作方法“DeleteAndSaveAtSameTimeModels”4次，然后调用默认路由，即搜索ActionMethod并返回更新的网格。

但它所做的是调用 BeginForm 操作方法“AllocationOnlyEdit”，然后吹走。 action 方法返回，

return Json(new { ok = true, AllocId = AllocId, y = y, newRows = newRows, sumtrans = sumtrans, tempsumtrancs = tempsumtrancs, result = Url.Action("AllocationModelSearch", objAllocationModels) }, JsonRequestBehavior.AllowGet);

Answer 1

我的假设是您的保存按钮在表单内，当您单击该按钮时，它正在执行正常的表单提交行为。在进行 ajax 调用之前，您应该阻止默认的表单提交行为。您可以使用 jQuery preventDefault 方法来执行此操作。

$(function(){
  $("#YourButtonId").click(function(e){
     e.preventDefault();   // This line does it !
     //Now continue with your ajax code here
     // $.ajax({});
  });
});

我还建议使用 POST 而不是 GET，因为 GET 对它可以通过查询字符串传递的数据量有限制。