Ajax 在模式窗口的部分视图中提交后检查错误

我有一个模式窗口，点击一个按钮就会弹出，其中包含一个部分视图，带有几个字段和一个提交按钮。在提交时，我将部分视图中的数据添加到数据库中，并重定向到生成弹出窗口的原始视图。所有这些都很好。但是，现在我想在控制器操作中执行错误检查（唯一性），并从模式视图中显示错误

下面是我如何设置模态窗口，其中包含部分视图

@Html.Kendo().Window().Name("CopyTaskWindow").Title("Copy Task").Modal(true).Width(400).Draggable().Iframe(false).Visible(false)

function onCopyClick(id) {
        var wnd = $("#CopyTaskWindow").data("kendoWindow");

        wnd.refresh({
            url: '@(Url.Action("CopyTaskRender", "Task"))',
            data: { id: id },
            iframe: true
        });
        wnd.center().open();
    }

这是局部视图

model pManager.Models.CopyTaskModel
    @using (Html.BeginForm("CopyTask", "Task", FormMethod.Post, new { id = "copyTaskForm" }))
    {
        @Html.HiddenFor(model=>model.TaskID)
        <div style="float: left; width: 48%;">
            <div class="editor-label">
                @Html.LabelFor(model => model.NewTaskName)
            </div>
            <div class="editor-field">
                @(Html.EditorFor(model=>model.NewTaskName))
            </div>
         </div>
    <div style="float: left; width: 48%;">
            <div class="editor-label">
                            @Html.LabelFor(model => model.ProjectId)
                </div>
            <div class="editor-field">
                                @(Html.Kendo().DropDownListFor(model => model.ProjectId) 
                                .DataTextField("Name") 
                                .DataValueField("ID") 
                                .DataSource(ds => ds 
                                    .Read("GetProjectsList", "Project").ServerFiltering(true) 
                                    ) 
                                ) 
            </div>
     </div>
    <div align="center" class="btns-container">
          <a class="k-button k-button-icontext k-grid-update btn-update" href="#" onclick="$('#copyTaskForm').submit()" >
                    <span class="k-icon k-update"></span>
                    Copy Task
                </a>
                <a class="k-button k-button-icontext k-grid-cancel btn-cancel" href="#">
                    <span class="k-icon k-cancel"></span>
                    Cancel
                </a>
        </div>
 }

如您所见，我试图通过执行ModelState.addmodeleror返回错误。但是，模式窗口仍将关闭，并渲染模式窗口外部的局部视图

有人能建议我如何实现从模态视图弹出的错误吗

---

谢谢你

你不能那样做。您需要使用远程验证。这是你可以做到的

您可以这样定义剑道窗口（更新）：

@Html.Kendo().Window().Name("CopyTaskWindow")
    .Title("Copy Task")
    .Modal(true).Width(400)
    .Draggable().Iframe(false)
    .Visible(false)
    .Events(events => events.Refresh("onRefresh")) // add a new event here...

function onRefresh(e) {
    // this is to make sure client validation works in the window...
    $.validator.unobtrusive.parse($("#CopyTaskWindow"));        
    // UPDATE: This will cause the validation to occur only on submit. 
    // But, as I explained in the comments, it won't work for remote validation...
    $.validator.setDefaults({
        onkeyup: false,
        onfocusout: false,
        onsubmit: true
    });

    var form = $("#CopyTaskWindow").find('#copyTaskForm');
    form.submit(function () {
        if (form.validate().valid()) {
            var wnd = $("#CopyTaskWindow").data("kendoWindow");
            wnd.close();
        }
    });
}

然后，在您的模型中，对需要验证其唯一性的属性使用

RemoteAttribute

，如下所示（我假设NewTaskName必须是唯一的，即使从您的代码中不清楚您想要做什么）：

然后，将验证错误消息添加到局部视图：

@model pManager.Models.CopyTaskModel
@using (Html.BeginForm("CopyTask", "Task", FormMethod.Post, new { id = "copyTaskForm" }))
{
    @Html.HiddenFor(model=>model.TaskID)
    <div style="float: left; width: 48%;">
        <div class="editor-label">
            @Html.LabelFor(model => model.NewTaskName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.NewTaskName)
            @Html.ValidationMessageFor(model => model.NewTaskName)
        </div>
     </div>

     // The rest of your Partial View... 
 } 

以及远程验证的新操作：

public ActionResult IsUnique(NewTaskCopy model)
{
    var isUnique = IsUnique(model.NewTaskName, model.ProjectId);

    return Json(isUnique, JsonRequestBehavior.AllowGet);
}

---

你不能那样做。您需要使用远程验证。这是你可以做到的

您可以这样定义剑道窗口（更新）：

@Html.Kendo().Window().Name("CopyTaskWindow")
    .Title("Copy Task")
    .Modal(true).Width(400)
    .Draggable().Iframe(false)
    .Visible(false)
    .Events(events => events.Refresh("onRefresh")) // add a new event here...

function onRefresh(e) {
    // this is to make sure client validation works in the window...
    $.validator.unobtrusive.parse($("#CopyTaskWindow"));        
    // UPDATE: This will cause the validation to occur only on submit. 
    // But, as I explained in the comments, it won't work for remote validation...
    $.validator.setDefaults({
        onkeyup: false,
        onfocusout: false,
        onsubmit: true
    });

    var form = $("#CopyTaskWindow").find('#copyTaskForm');
    form.submit(function () {
        if (form.validate().valid()) {
            var wnd = $("#CopyTaskWindow").data("kendoWindow");
            wnd.close();
        }
    });
}

然后，在您的模型中，对需要验证其唯一性的属性使用

RemoteAttribute

，如下所示（我假设NewTaskName必须是唯一的，即使从您的代码中不清楚您想要做什么）：

然后，将验证错误消息添加到局部视图：

@model pManager.Models.CopyTaskModel
@using (Html.BeginForm("CopyTask", "Task", FormMethod.Post, new { id = "copyTaskForm" }))
{
    @Html.HiddenFor(model=>model.TaskID)
    <div style="float: left; width: 48%;">
        <div class="editor-label">
            @Html.LabelFor(model => model.NewTaskName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.NewTaskName)
            @Html.ValidationMessageFor(model => model.NewTaskName)
        </div>
     </div>

     // The rest of your Partial View... 
 } 

以及远程验证的新操作：

public ActionResult IsUnique(NewTaskCopy model)
{
    var isUnique = IsUnique(model.NewTaskName, model.ProjectId);

    return Json(isUnique, JsonRequestBehavior.AllowGet);
}

---

什么是独一无二的？这在你的代码中并不清楚。我没有包括IsUnique函数，因为它与这个问题并不相关。它只是一个布尔函数，用于检查projectd项目中是否存在任务名称，如果存在，则返回true。我的问题是，如果isUnique返回false，如何在模式窗口中显示错误？我知道，但您所做的是错误的。您应该检查model.NewTaskName是否唯一，而不是task.Name.Ah，您是对的。非常感谢。然而，这并不能回答我的问题。谢谢你指出这一点。什么是独一无二的？这在你的代码中并不清楚。我没有包括IsUnique函数，因为它与这个问题并不相关。它只是一个布尔函数，用于检查projectd项目中是否存在任务名称，如果存在，则返回true。我的问题是，如果isUnique返回false，如何在模式窗口中显示错误？我知道，但您所做的是错误的。您应该检查model.NewTaskName是否唯一，而不是task.Name.Ah，您是对的。非常感谢。然而，这并不能回答我的问题。谢谢你指出这一点。谢谢！除了一个问题外，这是可行的：出于某种原因，即使验证失败，模式窗口仍会关闭。似乎form.validate（）.valid（）的计算结果为true，即使IsUnique返回true也是如此。当我再次单击按钮打开模式窗口时，我看到了验证消息。实际上，

form.validate（）.valid（）

不适用于远程验证，我只是在表单中添加了它，以防您有其他验证。它不起作用，因为远程验证是异步的。但是，您应该在向上键或离开文本框时收到验证错误消息。如果不是这样，那可能是浏览器的问题。您使用的浏览器是什么，jQuery验证的版本是什么？我不确定之前看到的是什么，但它的工作原理与您描述的完全相同。谢谢，这解决了我的问题！但是，您认为是否也可以仅在提交时进行验证？对每个击键进行唯一检查似乎有点慢…不幸的是，您无法在窗口中进行远程验证。因为，在没有任何验证错误的情况下，您希望关闭窗口，对吗？但是，您不能这样做，因为正如我所说的，远程验证是异步的。表单不会等待远程验证结果从服务器返回，这就是为什么

form.validate（）.valid（）

始终为真。但是，您可以在常规视图中执行此操作。看看我更新的答案。谢谢！除了一个问题外，这是可行的：出于某种原因，即使验证失败，模式窗口仍会关闭。似乎form.validate（）.valid（）的计算结果为true，即使IsUnique返回true也是如此。当我再次单击按钮打开模式窗口时，我看到了验证消息。实际上，

form.validate（）.valid（）

不适用于远程验证，我只是在表单中添加了它，以防您有其他验证。它不起作用，因为远程验证是异步的。但是，您应该在向上键或离开文本框时收到验证错误消息。如果不是这样，那可能是浏览器的问题。您使用的浏览器是什么，jQuery验证的版本是什么？我不确定之前看到的是什么，但它的工作原理与您描述的完全相同。谢谢，这解决了我的问题！但是，您认为是否也可以仅在提交时进行验证？对每个击键进行唯一检查似乎有点慢…不幸的是，您无法在窗口中进行远程验证。因为，在没有任何验证错误的情况下，您希望关闭窗口，对吗？但是，您不能这样做，因为正如我所说的，远程验证是异步的。表单不会等待远程验证结果从服务器返回，这就是为什么

form.validate（）.valid（）

始终为真。但是，您可以在常规视图中执行此操作。请参阅我的最新答案。