弹出对话框形式的行为与其来源不同：编辑视图

Question

我的 Index 视图是数据库中 table 的表示。每行都有 Edit 按钮显示 Edit 使用 jQuery 在弹出对话框中显示的视图。我的这个 table 模型有一些验证，如果我在 Edit 视图中提供了错误的值，它会显示错误消息并允许我更正错误。

当我打开 Edit 通过按钮查看时，意思是在弹出对话框中。输入不正确的值后，它会向我显示错误（虽然一个错误的颜色与其他错误不同，不知道为什么）但它不允许我 select 新值，看起来弹出对话框中的表单在闪烁或清爽。

我不想复制我所有的代码，所以我只分享我认为可能是问题的地方，这些是创建弹出对话框的脚本：

<script>
var Popup;
$(document).ready(function () {
    $('#table').DataTable();
});

function PopupForm(url) {
    var formDiv = $('<div/>');
    $.get(url)

        .done(function (response) {
            formDiv.html(response);
            Popup = formDiv.dialog({
                autoOpen: true,
                dialogClass: 'zPosition',
                resizable: false,
                title: 'Fill details',
                position: { my: "center top", at: "center top+5%", of: window },
                height: 750,
                width: 700,
                // modal ensures only one dialog window open
                //modal: true,
                close: function () {
                    Popup.dialog('destroy').remove();
                }
            });
        });
};
function LoadCursor() {
    $('*').css('cursor', 'wait');
};
function SubmitForm(form) {
    $('body').css('cursor', 'wait');

    $.ajax({
        type: "POST",
        url: form.action,
        data: $(form).serialize(),
        success: function (data) {
            if (data.success) {
                Popup.dialog('close');
                location.reload(true);
            }
            else {
                Popup.html(data);
                SubmitForm(form);
            }
        },
    complete: function () {
            $('body').css('cursor', 'default');
        }
    });
    return false;
};

</script>

控制器：

[HttpPost]
    public ActionResult Edit([Bind(Include = "Id,Country,Name")] Person person)
    {
            ViewBag.Country = new SelectList(db.Countries, "Id", "CountryName", person.Country);
        if (ModelState.IsValid)
        {
                db.Entry(person).State = EntityState.Modified;
                db.SaveChanges();
                return Json(new { success = true, message = "Updated Successfully" }, JsonRequestBehavior.AllowGet);
        }
        return View(person);
    }

在正常 Edit 视图中一切正常但在弹出对话框中闪烁，不允许我更改错误的问题是什么？

我没有提供完整的控制器、视图、模型，因为一切都在正常的 Edit 视图中工作，只有在弹出对话框中 Edit 视图无法正常工作。如果还需要什么，我会提供。

我正在使用以下脚本：

<script src="~/Scripts/jquery-ui-1.12.1.js"></script>
<script src="~/Datatables/DataTables-1.10.18/js/jquery.dataTables.js"></script>
<script src="~/Datatables/DataTables-1.10.18/js/dataTables.bootstrap4.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="~/Scripts/expressive.annotations.validate.js"></script>

Answer 1

有点愚蠢，但我的 SubmitForm 函数在失败时执行 SubmitForm 函数。

弹出对话框形式的行为与其来源不同：编辑视图

Popup dialog form behaves different than it's source: Edit view

c#

asp.net-mvc

jquery-ui

datatables

unobtrusive-validation