在 JqueryUI 对话框中捕获并显示错误答案

【问题标题】：Capture and Display error inside JqueryUI dialog在 JqueryUI 对话框中捕获并显示错误
【发布时间】：2018-05-19 08:37:50
【问题描述】：

我正在使用 JQuery-UI 对话框来加载 MVC 部分视图

这里是一些示例代码：

$(function () {

function fSetupDialogs() {

    $("#dialog-popup").dialog({
      autoOpen: false,
      resizable: true,
      modal: true
    });
}
});



$('body').on('click', '.popup-Edit',
    function (e) {

        url = $(this).data("url");

        $("#dialog-popup")
            .load(url)
            .html("<img src='/content/images/Spinner.gif'>")
            .dialog("option", "title", "Edit " + url.split("/").pop())
            .dialog('open');

    }
);

尽管偶尔会出现一些奇怪的滚动条和其他东西，但效果很好。

问题是当视图抛出错误时，我不知道如何检查它并在 jqueryui 面板中显示它

因此，如果视图返回 500 或 401 错误，我想捕获它并在对话框中显示它。现在发生的事情是微调器 GIF 永远坐在那里。如果我打开 F12 控制台，我可以在其中看到错误。

我尝试使用.error 事件处理程序，它确实捕获它并弹出一个消息框。但我想在弹出窗口中显示：

        // This pops up an error alert
        $("#dialog-popup")
            .load(url)
            .error(alert("error"))
            .html("<img src='/content/images/Spinner.gif'>")
            .dialog("option", "title", "Edit " + url.split("/").pop())
            .dialog('open');

如何在对话框中显示内容？这没有效果 - 微调器停留在那里

        // This has no effect - I want to see the words "error" 
        $("#dialog-popup")
            .load(url)
            .error($("#dialog-popup").html("error"))
            .html("<img src='/content/images/Spinner.gif'>")
            .dialog("option", "title", "Edit " + url.split("/").pop())
            .dialog('open');

对于奖励积分，我如何使用 javascript 错误对象来识别 401、500 什么的？ - 我还没到那个地方。

【问题讨论】：

标签： javascript asp.net-mvc-5 jquery-ui-dialog

【解决方案1】：

我查看了自己的代码并找到了答案。

load 方法接受一个回调参数，可以用来做我需要的事情

我编写了一个名为popupComplete 的函数，它会在加载完成时调用。

// This loads a partial MVC view into the popup
$("#dialog-popup")
    .load(url,popupComplete)
    .html("<div align='middle'><img src='/content/images/Spinner.gif'></div>")
    .dialog("option", "title", "New")
    .dialog("open");

// when the load is complete, this is called
// which optionally displays an error inside the popup
function popupComplete(response, status, xhr) {
    if (status === "error") {
        var msg =
            "<BR><BR><BR><H3 style='text-align: center;'><span style='color: red;' class='glyphicon glyphicon-fire'></span>   Confound it!<BR><BR>" +
            xhr.status + " " + xhr.statusText + 
            "<BR><BR>" + (xhr.status == 401 ? "Try logging in again" : "") +
            "</B></H3>";
        $("#dialog-popup").html(msg);
    }
}

【讨论】：