JQuery DIalog和ASP.NET Repeater

Question

我有一个ASP.NET转发器,它显示了一个带有删除LinkBut​​ton的项目列表.

我想设置Delete LinkBut​​tons以显示JQuery对话框以进行确认.如果单击"确定"按钮,我想进行回发.

显而易见的问题是转发器中的每个LinkBut​​ton都有自己的ID,我不想复制对话框的所有javascript.

建议？

Answer 1

解决方案并非如此简单.按下jQuery UI Dialog的Ok按钮后,您必须能够调用原始回调函数.

首先,您需要一个通用的js函数来显示对话框:

function showConfirmRequest(callBackFunction, title, content) 
{
    $("#divConfirm").html(content).dialog({
        autoOpen: true,
        modal: true, 
        title: title,
        draggable: true,
        resizable: false,
        close: function(event, ui) { $(this).dialog("destroy"); },
        buttons: { 
            'Ok': function() { callBackFunction(); },
            'Cancel': function() {
                $(this).dialog("destroy");
            }
        },
        overlay: { 
            opacity: 0.45, 
            background: "black" 
        } 
    });
}

我认为像div一样存在

<div id="divConfirm"></div>

在c#代码隐藏之后,你必须注册以前的客户端函数,将控件的原始asp.net callbackFunction作为参数传递(我概括):

protected void AddConfirmRequest(WebControl control, string title, string message) 
{
    string postBackReference = Page.ClientScript.GetPostBackEventReference(control, String.Empty);
    string function = String.Format("javascript:showConfirmRequest(function() {{ {0} }}, '{1}', '{2}'); return false;", 
                                     postBackReference,
                                     title,
                                     message);
    control.Attributes.Add("onclick", function);
}

通过GetPostBackEventReference方法,您可以检索asp.net分配给控件的回发函数.

现在,在Repeater ItemDataBound上,检索执行删除的控件并将其传递给此函数:

<asp:Repeater ID="repeater" runat="server" OnItemDataBound="repeater_OnItemDataBound">
    ...
    <ItemTemplate>
        ...
        <asp:Button ID="btnDelete" runat="server" Text="Delete" />
        ...
    </ItemTemplate>
</asp:Repeater>

和代码:

protected void repeater_OnItemDataBound(object sender, RepeaterItemEventArgs e)
{
    if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)
    {
        WebControl btnDelete = ((WebControl)e.Item.FindControl("btnDelete"));
        AddConfirmRequest(btnDelete, "Confirm delete", "Are you sure? Really???");
    }
}

我希望这有帮助.