ASP.Net Repeater结合Bootstrap3删除确认模态框问题求助

我完全懂你折腾一整天的崩溃感——模态框能弹能关，可关键的删除逻辑就是触发不了，确实挺闹心的。咱们先拆解问题，再一步步搞定它。

问题根源分析 #

1. LinkButton的回发被阻止：你当前的lbDelete按钮OnClientClick="return ConfirmDelete()"直接返回了false，这会彻底阻止按钮本身的服务器回发，所以Repeater的ItemCommand事件根本没机会执行。
2. 模态框删除按钮无关联数据：模态框里的btnDeleteImage是独立的服务器按钮，它不知道你点击的是Repeater里哪一行的删除按钮，自然没法传递对应的ProductImageId来触发正确的删除逻辑。

完整解决方案（两种实现思路） #

思路一：用隐藏字段存储ID，直接在模态框按钮中处理删除

这个方案更简单，不需要依赖Repeater的ItemCommand，直接通过隐藏字段传递要删除的ID。

1. 添加隐藏字段存储删除ID

<asp:HiddenField ID="hfDeleteId" runat="server" />

2. 修改Repeater中的删除按钮
   把原来的OnClientClick改成传递当前行ID并弹出模态框，同时阻止默认回发：

<asp:LinkButton ID="lbDelete" runat="server" 
    CommandArgument='<%#Eval("ProductImageId")%>' 
    CommandName="delete" 
    data-toggle="tooltip" data-placement="top" title="Delete this record" 
    OnClientClick="SetDeleteId(this); $('#DeleteModal').modal('show'); return false;">
    <i class="image-button fa fa-trash"></i>
</asp:LinkButton>

3. 添加JavaScript函数存储ID到隐藏字段

<script>
    function SetDeleteId(btn) {
        // 获取当前按钮的CommandArgument（即ProductImageId）并存入隐藏字段
        document.getElementById('<%= hfDeleteId.ClientID %>').value = btn.getAttribute('CommandArgument');
    }
</script>

4. 修改模态框删除按钮的后台逻辑
   在btnDeleteImage_Click事件中读取隐藏字段的值，执行删除并刷新Repeater：

protected void btnDeleteImage_Click(object sender, EventArgs e)
{
    if (!string.IsNullOrEmpty(hfDeleteId.Value))
    {
        int deleteId = int.Parse(hfDeleteId.Value);
        // 这里写入你的删除逻辑（比如从数据库删除对应ID的记录）
        // 示例：ProductImageService.Delete(deleteId);
        
        // 重新绑定Repeater数据
        BindRepeaterData(); // 假设你有这个绑定数据的方法
    }
}

思路二：触发Repeater的ItemCommand事件

如果你更倾向于用Repeater自带的ItemCommand来统一处理逻辑，可以通过隐藏按钮模拟回发：

1. 添加隐藏字段和隐藏LinkButton

<asp:HiddenField ID="hfDeleteId" runat="server" />
<!-- 隐藏按钮用来模拟Repeater删除按钮的回发 -->
<asp:LinkButton ID="lbHiddenDelete" runat="server" 
    CommandName="delete" 
    Style="display: none;" 
    OnCommand="rptImages_ItemCommand"></asp:LinkButton>

2. 修改Repeater删除按钮的OnClientClick
   和思路一一致，先存储ID再弹出模态框：

<asp:LinkButton ID="lbDelete" runat="server" 
    CommandArgument='<%#Eval("ProductImageId")%>' 
    CommandName="delete" 
    data-toggle="tooltip" data-placement="top" title="Delete this record" 
    OnClientClick="SetDeleteId(this); $('#DeleteModal').modal('show'); return false;">
    <i class="image-button fa fa-trash"></i>
</asp:LinkButton>

3. 修改模态框的删除按钮为HTML按钮
   把原来的服务器按钮换成普通HTML按钮，点击时触发隐藏按钮的回发：

<button type="button" class="btn btn-danger" onclick="TriggerRepeaterDelete()">Delete</button>

4. 添加JavaScript触发隐藏按钮回发

<script>
    function SetDeleteId(btn) {
        document.getElementById('<%= hfDeleteId.ClientID %>').value = btn.getAttribute('CommandArgument');
    }

    function TriggerRepeaterDelete() {
        var deleteId = document.getElementById('<%= hfDeleteId.ClientID %>').value;
        var hiddenBtn = document.getElementById('<%= lbHiddenDelete.ClientID %>');
        // 给隐藏按钮设置要删除的ID
        hiddenBtn.setAttribute('CommandArgument', deleteId);
        // 触发隐藏按钮的回发，从而触发Repeater的ItemCommand
        hiddenBtn.click();
        // 关闭模态框
        $('#DeleteModal').modal('hide');
    }
</script>

5. Repeater的ItemCommand事件逻辑保持不变

protected void rptImages_ItemCommand(object source, RepeaterCommandEventArgs e)
{
    if (e.CommandName == "delete")
    {
        int deleteId = int.Parse(e.CommandArgument.ToString());
        // 执行删除逻辑
        BindRepeaterData();
    }
}

额外注意事项 #

• 如果使用了UpdatePanel，记得把hfDeleteId放到UpdatePanel的ContentTemplate内部，或者给UpdatePanel添加对应的触发器，避免隐藏字段值不更新。
• 若UpdatePanel回发后模态框出现显示异常，可以添加页面请求结束事件重置模态框：

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function() {
    $('#DeleteModal').modal('hide');
});

内容的提问来源于stack exchange，提问作者Grant S