0

我已经编写了一个 Jquery-Ui 对话框来弹出作为对特定链接的确认。但是，这不会正确重定向到我的删除页面。但是，如果我在 chrome 中打开调试器进行调试，那么代码会按预期工作。

我发现了同样的问题，但是该解决方案似乎对我不起作用。这是完全相同的场景。此处的问题JavaScript 重定向不起作用，并且仅在打开调试器时才在 Chrome 中起作用

所以我有我的链接

<div id="confirm-dialog">
    <div class="dialog-inner">
        <p id="confirm-dialog-message"></p>
    </div>
</div>
<a href="/Customer/Delete/73865878346587" class="confirmLink" title="Delete Customer" data-confirm-message="Are you sure you want to delete this customer?">Delete</a>

我有我的 javascript

    $('.confirmLink').click(function (e) {
    BodyScrolling(false);

    var theHref = $(this).attr("href");
    var theTitle = $(this).attr("title") == null ? "Confirm..." : $(this).attr("title");
    var theText = $(this).attr("data-confirm-message") == null ? "Are you sure?" : $(this).attr("data-confirm-message");

    $("#confirm-dialog-message").html(theText);
    $("#confirm-dialog").parent().css({ position: "fixed" }).end().dialog("open");
    $("#confirm-dialog").dialog({
        title: theTitle,
        close: function() {
            BodyScrolling(true);
        },
        buttons: [
        {
            text: "Yes",
            class: "mws-button red",
            click: function () {
                $("#confirm-dialog").dialog("close");
                window.location.href = theHref;
                return false;
            }
        },
        {
            text: "No",
            class: "mws-button black",
            click: function () {
                $("#confirm-dialog").dialog("close");
            }
        }]
    });
    return false;
});

因此，当我单击“删除”链接时，确实会看到带有“是”和“否”按钮的确认对话框，CSS 样式正确，并已捕获链接 href 并将其绑定到“是”按钮。如果我点击“否”，我会被踢回来，不会再发生任何事情 - 正确！

如果我单击是，它应该将我发送到它捕获的原始 href。我在重定向之前的“是”按钮单击上引发了警报（theHref），它确实向我显示了正确的地址（/Customer/Delete/73865878346587），但没有发生重定向。

当我打开 chrome 调试器来调试 javascript 或查看是否发生任何错误时，一切都按预期工作并正确重定向我！

在 IE 中，它也不起作用。

我试过了...

window.location.href = theHref
window.location = theHref
location.href = theHref
$(location).attr('href', theHref)

我也尝试过添加 return false; 在我重定向之后。没有任何效果。

我在上面添加到同一个问题的链接说要确保“是”按钮在页面上呈现为 ... 我的是。

任何人都可以解释一下吗？

4

2 回答 2

0

代替window.location.href = theHref;

你试过window.location.replace(theHref);吗？

回到基础，尝试：window.location = theHref;

于 2013-07-05T17:29:53.320 回答
0

好吧，我找到了答案。Javascript 是一条红鲱鱼！

我确实尝试删除 confirmLink jQuery 类，以便该链接只是一个标准链接，直接进入我的控制器以执行我的删除操作。当我做这个测试时，链接工作得很好。因此，我表示问题出在我的 javascript 上。但是，似乎情况并非如此，只有在 Chrome 中的调试器当时已经打开或打开时才能再次工作。

当我再次重新访问非确认链接选项时，我发现这不能正常工作，因此表示问题与 javascript 无关。

您似乎无法从 MVC 中的 HTML 链接执行删除操作。这显然是因为涉及安全风险，因为任何人都可以对 ID 执行删除。我在我的实现中考虑到了这一点，并添加了代码来检查请求的来源，如果它不是来自我的列表页面，那么它会返回一个错误并且不会执行删除。我给我的控制器起什么名字也没关系，例如测试，执行我的 HTTP GET 请求的链接永远不会碰到这个。必须有某种算法来确定操作正在做什么并阻止您对 HttpGet 请求执行操作。有关删除操作的更多信息，请查看这篇文章http://stephenwalther.com/archive/2009/01/21/asp-net-mvc-tip-46-ndash-donrsquot-use-delete-links-because

似乎您只能通过 HTTP Post 执行此操作，这意味着使用Ajax.ActionLink或使用表单和提交按钮。然后必须为 HttpPost 指定您的操作。

如果像我一样，您希望将链接保留为 HTML 链接，那么您可以执行以下操作，这就是我所做的，代码如下。我保留了我的 HTML 链接，将其设置为指向我的 HttpPost 删除操作。为 jquery 添加了我的 confirmLink 类以将我的对话框绑定到。我拿起链接href并在jquery对话框中设置“是”按钮以动态创建表单并将方法设置为发布并将操作设置为链接href。然后我可以在新的动态创建的表单上调用提交来执行我的发布到我的删除操作。

我的删除链接

Html.ActionLink("Delete", "Delete", "Caterer", new { id = caterer.Id }, new { @class = "mws-ic-16 ic-delete imageButton confirmLink", @data_confirm_title = "Delete " + caterer.Name, @data_confirm_message = "Are you sure you want to delete this caterer, " + caterer.Name + "?" })

我的 Javascript

function LoadConfirm() {
    $('.confirmLink').click(function (e) {
        e.preventDefault();
        BodyScrolling(false);

        var actionHref = $(this).attr("href");
        var confirmTitle = $(this).attr("data-confirm-title");
        confirmTitle = confirmTitle == null ? "Confirm..." : confirmTitle;

        var confirmMessage = $(this).attr("data-confirm-message");
        confirmMessage = confirmMessage == null ? "Are you sure?" : confirmMessage;

        $("#confirm-dialog").dialog({
            autoOpen: false,
            modal: true,
            width: 400,
            closeOnEscape: true,
            close: function () { BodyScrolling(true); },
            title: confirmTitle,
            resizable: false,
            buttons: [
            {
                text: "Yes",
                class: "mws-button red",
                click: function () {
                    StartLoading();
                    $(this).dialog("close");
                    var form = document.createElement("form");
                    form.setAttribute("method", "post");
                    form.setAttribute("action", actionHref);
                    form.submit();
                }
            },
            {
                text: "No",
                class: "mws-button black",
                click: function () {
                    $("#confirm-dialog").dialog("close");
                    return false;
                }
            }
            ]
        });
        $("#confirm-dialog #confirm-dialog-message").html(confirmMessage);
        $("#confirm-dialog").parent().css({ position: "fixed" });
        $("#confirm-dialog").dialog("open");
    });
}

我的行动 

    [HttpPost]
    [Authorize(Roles = "User")]
    public ActionResult Delete(long id)
    {
        //Perform my delete

        return RedirectToActionPermanent("List");
    }
于 2013-07-10T09:05:46.110 回答