Asp.net mvc 5 MVC 5 Ajax.BeginForm Submit按钮调用当前页面，而不是指定控制器和操作的URL

我正在尝试使用Ajax.BeginForm，以便将复选框的值传递给我的控制器操作

[HttpPost]
[ValidateAntiForgeryToken]
public async Task<ActionResult> GetCode(Guid offerId, bool optIn = false)
{
  //Code here 

  return PartialView("_OfferCode");
}

我使用的是@Ajax.ActionLink，但我无法获得新引入的复选框的值，因此我想继续使用Ajax.BeginForm

因为@Ajax.ActionLink在视图中工作，所以我假设Ajax工作正常，所以我可以排除这种可能性

以下是我尝试过的几个选项。当我将鼠标悬停在按钮上时，它们都显示我的网页的URL，而不是控制器和操作的URL。当我单击按钮时，页面基本上会刷新，而不是调用PublicOffers控制器中的GetCode操作

非常感谢您的帮助！谢谢

选项1

<div>
    @using (Ajax.BeginForm("GetCode", "PublicOffers", null, new AjaxOptions()
    {
     UpdateTargetId = "detailsDiv",
     InsertionMode = InsertionMode.Replace,
     HttpMethod = "GET",
     OnBegin = "onStart",
     OnComplete = "onComplete",
     OnSuccess = "myCallback"
    }))
    {
     //bool checkedOption = false;
     //@Html.CheckBoxFor(x => checkedOption, new { Name = "OptIn" })

     @Html.CheckBoxFor(model => model.OptIn);
     @Html.HiddenFor(model => model.Id);

     <input type="submit" value="Get Code" class="button btn-primary" />
     }
</div>

@使用（Ajax.BeginForm（“GetCode”、“PublicOffers”、null、新的AjaxOptions（））
{
UpdateTargetId=“detailsDiv”，
InsertionMode=InsertionMode.Replace，
HttpMethod=“GET”，
OnBegin=“onStart”，
OnComplete=“OnComplete”，
OnSuccess=“myCallback”
}))
{
//bool checkedOption=false；
//@CheckBoxFor（x=>checkedOption，new{Name=“OptIn”}）
@CheckBoxFor（model=>model.OptIn）；
@HiddenFor（model=>model.Id）；
}

选项2

<div>    
   @using (Ajax.BeginForm(new AjaxOptions() 
   { HttpMethod = "GET", 
     Url = "PublicOffers/GetCode", 
     InsertionMode = InsertionMode.Replace, 
     UpdateTargetId = "detailsDiv", 
     OnBegin = "onStart", 
     OnComplete = "onComplete", 
     OnSuccess = "myCallback" 
   }))
   {
       //bool checkedOption = false;
       //@Html.CheckBoxFor(x => checkedOption, new { Name = "OptIn" })
       @Html.CheckBoxFor(model => model.OptIn)
       //@Html.HiddenFor(model => model.Id, new { Name = "OfferId" })
       @Html.HiddenFor(model => model.Id);
       @Html.AntiForgeryToken()

       <input type="submit" value="Submit" />
    }
</div>

@使用（Ajax.BeginForm）（新的AjaxOptions（）
{HttpMethod=“GET”，
Url=“PublicOffers/GetCode”，
InsertionMode=InsertionMode.Replace，
UpdateTargetId=“detailsDiv”，
OnBegin=“onStart”，
OnComplete=“OnComplete”，
OnSuccess=“myCallback”
}))
{
//bool checkedOption=false；
//@CheckBoxFor（x=>checkedOption，new{Name=“OptIn”}）
@CheckBoxFor（model=>model.OptIn）
//@Html.HiddenFor（model=>model.Id，新的{Name=“OfferId”}）
@HiddenFor（model=>model.Id）；
@Html.AntiForgeryToken（）
}

这不是一个确切的答案，但可能会有所帮助

首先确保你有这个，我用NuGet安装它， Microsoft.jQuery.Unobtrusive.Ajax

然后确保它通过捆绑脚本或cshtml中的脚本链接发送到页面

首先是一个简单的模型

namespace AjaxTest.Models
{
    public class AjaxTestModel
    {
        public bool OptIn { get; set; }

    }
}

接下来是一些cshtml

@model AjaxTest.Models.AjaxTestModel
@{ ViewBag.Title = "AjaxTest1";}
<h2>AjaxTest1</h2>
@using (Ajax.BeginForm("AjaxTest1", "Home", null,
    new AjaxOptions
    {
        HttpMethod = "POST",
        OnSuccess = "OnSuccess(xhr)",
        OnFailure = "OnFailure(xhr, status)"
    },
    new { id = "myform" }))
{
    @Html.CheckBoxFor(model => model.OptIn);
    <span id="lbl_message"></span>
    <br />
    <button id="btn_submit" type="submit" class="">Submit</button>
}
@section scripts{
    <script>
        $(document).ready(function () {
            console.log("ready to rock and roll....");
        });
        function OnBegin() {
            console.log("OnBegin");
        }
        function OnSuccess(xhr) {
            console.log("OnComplete");
            $("#lbl_message").text("Ok:" + xhr.responseJSON.param2);
        }
        function OnFailure(xhr, status) {
            console.log("OnFailure");
            $("#lbl_message").text("Error:" + xhr.responseJSON.param2);
        }
    </script>
}

---

注意，HttpContext.Response.StatusCode将控制激活哪个Ajax回调，返回HttpStatusCode.Ok并调用OnSuccess，返回HttpStatusCode.NotFound或大多数其他错误代码，然后调用OnFailure

我通过添加一个开始的Ajax.BeginForm方法来实现它。这几乎就像第一个实例调用第二个Ajax.BeginForm方法一样。由于第一个方法中没有按钮或任何其他内容，因此页面上不会显示任何内容

注意：我更改了Get to a Post，因此[ValidateAntiForgeryToken]属性可用于控制器操作。我读到它不适用于Get

<div>
  @using (Ajax.BeginForm("GetCode", "PublicOffers", new { offerId = Model.Id }, new AjaxOptions()
  {
    //Nothing here, but for some reason without this code the Ajax.BeginForm below won't work                                        
  }))
  {
    //Nothing here, but for some reason without this code the Ajax.BeginForm below won't work    
  }
</div>

<div>
  @using (Ajax.BeginForm("GetCode", "PublicOffers", new { offerId = Model.Id },
    new AjaxOptions { OnBegin = "onStart", UpdateTargetId = "detailsDiv",
    InsertionMode = InsertionMode.Replace, HttpMethod = "Post",
    OnComplete = "onComplete",
    OnSuccess = "myCallback"},
    new { @style = "display:inline-block" }))
    {
      @Html.AntiForgeryToken()

      <div class="form-horizontal">
        <div class="form-group">
          @Html.CheckBoxFor(model => model.OptIn, new { Name = "optIn"})
        </div>
      </div>
       <input type="submit" class="button btn-primary" value="Get Code" id="get-code button" />
    }
</div>

@使用（Ajax.BeginForm（“GetCode”，“PublicOffers”），新的{offerId=Model.Id}，新的AjaxOptions（）
{
//这里什么都没有，但是由于某种原因，没有这段代码，下面的Ajax.BeginForm将无法工作
}))
{
//这里什么都没有，但是由于某种原因，没有这段代码，下面的Ajax.BeginForm将无法工作
}
@使用（Ajax.BeginForm（“GetCode”、“PublicOffers”），新的{offerId=Model.Id}，
新的AjaxOptions{OnBegin=“onStart”，UpdateTargetId=“detailsDiv”，
InsertionMode=InsertionMode.Replace，HttpMethod=“Post”，
OnComplete=“OnComplete”，
OnSuccess=“myCallback”}，
新的{@style=“display:inline block”}）
{
@Html.AntiForgeryToken（）
@CheckBoxFor（model=>model.OptIn，新的{Name=“OptIn”}）
}

这是我的控制器操作

[HttpPost]
[ValidateAntiForgeryToken]
public async Task<ActionResult> GetCode(Guid offerId, bool optIn = false)
{
  //Code here 

  return PartialView("_OfferCode");
}

[HttpPost]
[ValidateAntiForgeryToken]
公共异步任务GetCode（Guid offerId，bool optIn=false）
{
//代码在这里
返回部分视图（“报价代码”）；
}

您能提供选项1的控制器代码吗？我将其添加到了我的答案中，这样人们就可以看到如何将复选框值传递给控制器。谢谢您的帮助！我让它工作了，但我没有用你的方法。请看下面我的答案。我不知道为什么会这样。如果这有帮助，请单击“帮助”图标，点击我的代表：））