5

我有一个包含一些数据项行的表。对于每一行，它将是一些将调用一些方法的操作链接（删除数据项，更改状态数据项等......）

在每个用户单击按钮之前，我希望显示一个 jquery 对话框并为用户提供一个包含一些信息的对话框，一个确定和取消按钮。

将调用 ChangeStatus 方法的 ajax.actionlink 的一些示例代码：

<%= Ajax.ActionLink(item.Status, "ChangeStatus", new { id = item.Id }, new AjaxOptions { UpdateTargetId = "ListReturns-Div", OnBegin = "StartChangeStatus", OnSuccess = "EndChangeStatus", OnFailure = "FailureChangeStatus" }, new { @class = "StatusBtn" })%>

这是被调用的jquery函数：

 function StartChangeStatus(e) {
            $('#dialog-confirm').dialog({
                resizable: false,
                height: 200,
                modal: true,
                buttons: {
                    'Continue': function () {
                        $(this).dialog('close');
                        $('#Loading-Div').show('slow');
                    },
                    Cancel: function () {
                        $(this).dialog('close');
                        e.preventDefault();
                    }
                }
            });
        }

actionlink 和 jquery 函数工作。但问题是单击操作链接时我无法暂停/停止当前操作。现在单击按钮时，孔进程正在运行，对话框确认按钮被忽略。所以我的问题是如何在继续之前通过对话框确认更改 actionlink 或 jquery 函数以按需要工作？

4

2 回答 2

4

我也试过你的代码，得到相同的行为。我已修改您的代码以显示确认框。

<%= Ajax.ActionLink("Link", 
                    "ChangeStatus", 
                    new { id = 3 }, 
                    new AjaxOptions { UpdateTargetId = "ListReturns-Div", 
                                      HttpMethod = "Post", 
                                      Confirm = "confirmClick" }, 
                                      new { @class = "StatusBtn" }
                   )
%>

它正在显示javascript确认。需要找出它不工作的原因。

于 2010-06-03T11:04:26.803 回答
2

从我的网站：

现在，Ajax.ActionLink 真的很有用，而 Confirm AjaxOption 更是……不过，这些天谁想要那些糟糕的 Javascript Alert？我正在使用 MVC 2 女士开发一个应用程序，并且我正在使用出色的 JQueryUI 库来自定义我所有元素的视觉效果。JQueryUI 拥有的最好的东西之一是对话框窗口......像“你确定要删除这个文件吗？是/否”......我想在我的 Ajax.ActionLink 中使用它们！

由于我没有在网上找到答案，我寻找一种简单的方法来做到这一点......现在我把它贴在这里。

首先：阅读并在您的页面上实施 Ricardo Covo 编写的精彩教程：“ASP MVC 删除确认与 Ajax 和 jQuery UI 对话框”（只需 google 即可）

我对他的 Javascript 代码进行了简单的更改，只需使用 remove() 而不是 hide('fast') 并将类“item”应用于 tr 以进行删除。

deleteLinkObj.closest("tr").hide('fast')

变成

deleteLinkObj.closest("tr.item").remove();

现在，在您遵循上一个教程之后，您可以替换

<%: Html.ActionLink([LinkName],[ActionName], new { id = item.Id }, new { @class = "delete-link" })%>

排与

<%:Ajax.ActionLink([LinkName],[ActionName],[ControllerName],new { id = item.Id },new AjaxOptions{HttpMethod = "Delete" /*You can use Post though*/,OnBegin = "JsonDeleteFile_OnBegin" /*This is the main point!*/}, new { @class = "delete-link" } ) %>

如果愿意，您可以使用 Post 方法，这里重要的是 OnBegin 选项，它调用一个 javascript，以防止在 JQueryUI 对话框确认之前调用服务器操作：

<script language="javascript">function JsonDeleteFile_OnBegin(context) {return false;/*Prevent the Ajax.Action to fire before needed*/}</script>

将 javascript 放在页面上。

所以，现在会发生什么：当您单击 Delete 按钮时，它将打开 JQueryUI，同时调用 OnBegin 函数（取消正常的 post 操作）。在“确认”的情况下，Ricardo Covo 的代码将触发服务器端操作，并且在 Ricardo Covo 的确认 javascript 代码中，您将能够在成功的情况下执行所有操作（例如隐藏行删除）。

注意：使用此方法，您必须在 Ricardo Covo 的 javascript 代码中管理成功/失败函数，因为 OnSuccess 和 OnComplete AjaxOptions 根本不会被触发（可能被某些代码覆盖）。

于 2010-11-16T08:41:39.817 回答