Javascript 根据模型验证，显示弹出消息或视图

想象一下，在签出过程中有一个包含多个步骤（视图）的webshop。当客户按下“下一步”按钮时，将调用相应的“操作”方法。在这种方法中，会进行一些验证，检查客户是否可以继续，或者订单是否有问题。根据验证结果，我希望发生以下两种情况之一：

A） 将生成并显示下一个视图

B） 客户停留在当前页面中，但会弹出一个模式对话框，其中包含一条错误消息

我已经尝试了在网络上找到的几种方法，但到目前为止没有任何效果。我最后尝试的是使用AJAX，但实际上我不知道这是否是正确的方法

public ActionResult SomeAction()
{
    if (ModelState.IsValid)
    { 
        return View();
    }
    // If not valid
    return errorMessage          
}


$(document).ready(function () {
    $("#btn").click(function () {
        $.ajax({
            url: "/Home/SomeAction",
            async: true,
            success: function (result) {
                if (!result.success) {
                    alert(result.error);
                }
                // Else display view
            }
        });

---

是否要在模式弹出窗口中显示局部视图？如果是这样的话，您可以使用jQueryAjax方法，就像您已经做过的那样，但是将其与jQueryPop-up/lightbox插件相结合，以显示生成的HTML

---

因此，在您的代码中，“/Home/SomeAction”是弹出窗口的PartialView，从控制器返回一个“PartialView”，当您在JQuery“success:”事件中收到HTML时，可以使用（例如）“JQuery Colorbox”来显示它（参见此处：）

无需ajax检查表单，为什么不使用几行javascript？比如“点击时，如果‘e-mail’输入字段为空，则抛出警报”等等。有很多表单验证插件，比如，只需谷歌一下

---

请参阅：

很难说您希望如何实现这样的工作流，但我想到的一件事是返回值，即TempData store中的错误，并正确重定向到下一步，或者验证失败到同一步

对于这样的简单模型：

public class Cart
{
    [Required]
    public string Item { get; set; }

    [Required]
    public string Quantity { get; set; }
}

public class CartController : Controller
{
    //
    // GET: /Cart/
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public ActionResult Index(Cart model)
    {
        if (ModelState.IsValid)
            return RedirectToAction("Step1");

        TempData["Error"] = "Validation failed";
        return View();
    }

    public ActionResult Step1()
    {
        // add more logic, steps etc
        return View();
    }
}

$.post("@Url.Action("Index")", values, function(data) {
    // add logic for loading next page or error
});

控制器的一些代码示例如下所示：

public class Cart
{
    [Required]
    public string Item { get; set; }

    [Required]
    public string Quantity { get; set; }
}

public class CartController : Controller
{
    //
    // GET: /Cart/
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public ActionResult Index(Cart model)
    {
        if (ModelState.IsValid)
            return RedirectToAction("Step1");

        TempData["Error"] = "Validation failed";
        return View();
    }

    public ActionResult Step1()
    {
        // add more logic, steps etc
        return View();
    }
}

$.post("@Url.Action("Index")", values, function(data) {
    // add logic for loading next page or error
});

在视图方面：

@using (Html.BeginForm())
{
     <fieldset>
       <p>
            <label for="Id">Item:</label>
            @Html.TextBox("Item") 
            @Html.ValidationMessage("Item", "*")
            @Html.Editor("Quantity")
       </p> 
        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

@if (TempData["Error"] != null)
{
    <p>Please fix all errors!</p>
}

在对象中，您必须使用适当的结构构建自己

---

祝你好运

不完全是。如果模型有效，我想显示一些连接到该操作的视图，但如果不是，我想保持在当前视图中，并显示一个弹出框，其中包含来自模型验证的一些错误消息。啊，我明白了，听起来您可能需要稍微扩展Jquery的非干扰性验证，以便在屏幕上出现的标准错误不够多的情况下显示弹出式错误。本例中的模型验证有点复杂，我不希望它泄漏到视图中。啊。这是我以前没有的一些信息在这样的场景中通常的工作流程是什么？如果这只是C#/.NET，我就不会有问题了，但是再加上一些JavaScript和HTML，我就完全迷路了。如果我回到同一步，这难道不像视图重新加载那样对用户可见吗？如果发生错误，我希望保持在同一个视图中，不会发生任何事情，只会弹出一个错误。我对示例进行了一些修改。Index（）中的return view（）将重新加载页面，对吗？返回一个显示错误框的脚本可以吗？或者这被认为是错误的做法吗？如果您在Index（）中，这意味着已经有一些对服务器的请求，则返回视图会指示MVC生成html并将其返回给客户端。您可以使用JavaScriptResult返回javascript-