Ajax.BeginForm处理两个不同的onSuccess响应，MVC 5，C＃

Question

我是Ajax和Jquery的新手，所以如果我想做一些愚蠢的事情，我需要您原谅我，我正在使用MVC 5和Ajax.Beginform，而我想做的是我需要一个Ajax表单如果不正确，请使用jquery进行验证，如果我正确地进行了验证，则使用ModelState进行Jquery验证，如果发现验证错误，则将再次返回视图，在这种情况下，我需要更新表单，以便验证消息出现在用户浏览器中，例如，这是我的控制器：

[HttpPost]
public ActionResult Index(AddProduct model)
{
    if (ModelState.IsValid)
    {
        // connect to the database save data etc... 
        return PartialView("~/Views/Shared/_MyModal.cshtml");
    }
    else
    {
        return View(model);
    }
}

如果ModelState.IsValid我应该保存数据并返回表示数据已成功保存的局部视图（Bootstrap Modal），否则它将返回整个视图以显示验证消息，并且为此我必须输入TargetId ajax表单，用于包装整个ajax表单以进行更新，这里是ajax表单：

<div id="result">
 @using (Ajax.BeginForm("Index", new AjaxOptions
  {
      InsertionMode = InsertionMode.Replace,
      UpdateTargetId = "result",
      HttpMethod = "POST",
      OnBegin = "onBegin();",
      OnComplete = "onCompleated();",
      OnSuccess = "onSuccess()",
      OnFailure = "onFailure()"
 }))
 {
@Html.ValidationSummary(true)
<div id="form1" class="form-horizontal">
    <div class="row">
        <div class="form-group">
            @Html.LabelFor(m => m.Name, new { @class = "col-md-2 control-label" })
            <div class="col-md-10">
                @Html.TextBoxFor(m => m.Name, new { @class = "form-control"       })
                @Html.ValidationMessageFor(m => m.Name, String.Empty, new { @class = "text-danger" })
            </div>
        </div>
        <div class="form-group">
            @Html.LabelFor(m => m.Price, new { @class = "col-md-2 control-label" })
            <div class="col-md-10">
                @Html.TextBoxFor(m => m.Price, new { @class = "form-control" })
                @Html.ValidationMessageFor(m => m.Price, String.Empty, new { @class = "form-help form-help-msg text-red" })
            </div>
        </div>

        <div class="form-group">
            <button class="btn btn-default col-md-2 col-md-offset-2" type="submit">Save &nbsp;&nbsp;</button>
        </div>
    </div>
</div>
 }
  </div>

否则我将返回一个局部视图，并将其显示为Bootstrap Modal，在这种情况下，我需要不更新Ajax形式targetId，我需要保持它完整无缺，而只是显示Modal，但是问题在于ModelState.IsValid或Is无效，所有响应都以ajax形式触发onSuccess方法，我不知道它们是否正常，这是javascript onsuccess（）方法：

function onSuccess() {
    $('#myModal').modal('hide')
    $("#resultModal").modal({
        backdrop: 'static',
        keyboard: false
    });
    $('#resultModal').on('hidden.bs.modal', function (e) {
        window.location = "/product";
    });
}

$（＃'myModal'）。modal（'hide'）是Modal的进度，我在发布完成后将其隐藏，下一步是显示结果Modal，如果Posting执行正常而没有验证错误，我将其返回，问题是 ：

• 如果验证错误正好存在，我可以使用ajax表单中的UpdatetargetId来更新表单，但是如果我返回“验证错误”或对我关心模态的部分视图，无论哪种情况，这种情况都可以发生，那是我不愿意做的事情，我需要保留表单，以防返回的Content是局部视图，并在ModelStat验证错误的情况下进行更新，也许我错过了一切，但是如果我愿意，我需要一些解释我回到正轨。

• 我做了一个丑陋的代码，凌乱，我不喜欢上面提到的onSuccess（）Mehtod，当我关闭我的结果时，我使用了事件触发Modal再次将我重定向到Index，所以窗体再次显示但不干净，我不喜欢不喜欢它，我需要专业的东西（如果存在）。

先感谢您，

Answer 1

我完全理解您的问题，并且准备向您展示我用来处理此案例的方法。

因此，由于每次都会调用 onSuccess 方法，而不取决于 ModelState 是否有效，因此您需要以稍微不同的方式处理响应。所以你的[HttpPost]方法应该是这样的：

 [HttpPost]
        public ActionResult Index(AddProduct model)
        {
            if (ModelState.IsValid)

            {
                return Json(new {isValid = true, data = this.RenderPartialViewToString("ViewWhenModelStasteIsValid",model,false)});
            }
            else
            {
                return Json(new { isValid = false, data = this.RenderPartialViewToString("ViewWhenModelStasteIsNotValid", model, false) });
            }
        }

public static string RenderPartialViewToString(this Controller controller, string viewName, object model)
        {
            if (string.IsNullOrEmpty(viewName))
            {
                viewName = controller.ControllerContext.RouteData.GetRequiredString("action");

            }
            controller.ViewData.Model = model;

            using (var sw = new StringWriter())
            {
                var viewResult = ViewEngines.Engines.FindPartialView(controller.ControllerContext, viewName);
                var viewContext = new ViewContext(controller.ControllerContext, viewResult.View, controller.ViewData, controller.TempData, sw);
                viewResult.View.Render(viewContext, sw);
                return sw.GetStringBuilder().ToString();
            }
        }

在视图中，您需要从表单中取出 UpdateTargetId 并在 success 函数上手动处理它。

所以你的 onSuccess 函数应该是这样的

function onSuccess(result, ref) {
         if (result.isValid) {
           jQuery("#result).html(result.data);
          } else {
            jQuery("#form1").html(result.data);
        }
    }

确保将响应数据传递给 onSuccess 函数，因此您需要将表单从OnSuccess = "onSuccess()"更改为OnSuccess = "onSuccess(data,this)"。

所以你的表格将如下所示：

@using (Ajax.BeginForm("Index", new AjaxOptions
  {
InsertionMode = InsertionMode.Replace,
HttpMethod = "POST",
OnBegin = "onBegin();",
OnComplete = "onCompleated();",
OnSuccess = "onSuccess(data,this)",
OnFailure = "onFailure()"
 }))

希望这是您所需要的。