javascript - ASP.net 和 Bootstrap (bootbox.js) 删除确认

Question

如何在asp.net中实现备用确认框。

<asp:LinkButton ID="btndelete" runat="server" CommandArgument='<%#Eval("ID")%>' CommandName="delete" CssClass="glyphicon glyphicon-trash" data-toggle="popover" data-placement="top" OnClientClick="return ConfirmDelete();" data-content="Delete this record"></asp:LinkButton>

<script type="text/javascript">
    function ConfirmDelete()
    {
         bootbox.confirm("Are you sure?", function (result)
         {
             if (result)
             {
                return true;
             } else
             {
                return false;
             }
         });
    }

</script>

但它不起作用...在单击确认框按钮之前服务器端事件触发(回发)。

Answer 1

几天后我检查了各种来源，终于可以正常工作了。我在 GridView 中有一个 LinkBut​​ton。

ASPX

<asp:TemplateField ShowHeader="False">
  <ItemTemplate>
  <asp:LinkButton ID="lnkBtnDelete" runat="server" CssClass="mylink" CausesValidation="false" Text="Delete" OnClick="lnkBtnDelete_Click">    </asp:LinkButton>
 </ItemTemplate>
</asp:TemplateField> 

在 GridView OnRowDatabound 事件中，将 OnClientClick 属性设置为 Javascript 以调用 bootbox 模式对话框。需要注意的重要事项是转义的单引号，并且我正在传递 LinkBut​​ton 的 UniqueID。 (因此，这将为 GridView 中的所有行调用并传递正确的 Id。)

GridView1_RowDataBound 位于代码后面

  protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {

        if (e.Row.RowType == DataControlRowType.DataRow)
        {

            GridViewRow gvrow = ((GridViewRow)e.Row);

            LinkButton lnkBtnDelete = gvrow.FindControl("lnkBtnDelete") as LinkButton;

            lnkBtnDelete.OnClientClick = "return confirmDelete(this,\'" + lnkBtnDelete.UniqueID + "\');";

        }
    }

confirmDelete Javascript 函数显示 bootbox 确认对话框。取消只会关闭模态表单，而不运行 LinkBut​​ton 单击事件，但确认按钮将运行与 LinkBut​​ton 关联的内置 Javascript 回发事件。如果将鼠标悬停在 LinkBut​​ton 上，您将看到正在调用的事件，并且由于我们传入了 UniqueID，因此它会为 GridView 中的每一行正确设置。

Javascript

function confirmDelete(sender, uniqueID) {
    if ($((sender)[0]).attr("confirmed") == "true") { return true; }

    bootbox.confirm("Are you sure you want to delete?", function (confirmed) {
        if (confirmed) {
            var link = $(sender)[0];
            //javascript: __doPostBack('BuildingCodeCompliance2$GridView1$ctl02$lnkBtnDelete', '');
            javascript: __doPostBack(uniqueID, '');
        }
    });

    return false;
}

LinkBut​​ton_Click 事件将仅具有常规删除功能。

LinkBut​​ton点击后面的代码

  protected void lnkBtnDelete_Click(object sender, EventArgs e)
    {

        LinkButton lnk = sender as LinkButton;
        GridViewRow gvrow = lnk.NamingContainer as GridViewRow;

        // Delete your record here

    }