Question

我想添加一个Jquery UI确认对话，但我不明白... 也许你可以帮助我。

我有一个网格，最后一行使用onClick事件调用元素的删除...

grid.Column(header: loc.GetText("CourseManagement_Action_Delete"), format: @<text><a href="@Url.Action("DeleteCourse", new { courseId = item.CourseId })" onclick="ConfirmDelete(item.courseID);"><img id="deleteImage" class="buttonHover" src="@Href("~/Content/images/delete.png")" alt="" style="border: none; position: relative;" /></a></text>, style: "columnWidth")

在我的Javascript中，我有以下

    function ConfirmDelete() {
    return confirm("Really delet");
}

我想更改它以获得Jquery UI确认对话。我怎么能意识到它？

感谢您的帮助。

Answer 1

您需要在页面中添加对话框的标记。像这样的东西，例如：

<div id="dialog-confirm" title="Delete record" style="display:none;">
  <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>Are you sure?</p>
</div>

然后将ConfirDelete函数更改为：

function ConfirmDelete(courseID) {
    $( "#dialog-confirm" ).dialog({
        resizable: false,
        height:240,
        modal: true,
        buttons: {
            "Delete item": function() {
                $( this ).dialog( "close" );
                var action = '@Url.Action("DeleteCourse",  new { courseID = "_id_" })'; 
                action = action.replace("_id_", courseID);
                window.location = action;
            },
            Cancel: function() {
                $( this ).dialog( "close" );
                return false;
            }
        }
    });
  return false; //The actual submission of the form happens in the click handler for the delete button
}

标题的onClick事件处理程序需要从

更改

 onclick="ConfirmDelete(item.courseID);"

要：

 onclick="return ConfirmDelete(item.courseID);">

Fiddle

JqueryUI确认对话框

1 个答案: