GridView 内的 ImageButton 与常规 ImageButton 的 OnClick 差异答案

【问题标题】：Difference in OnClick for ImageButton inside a GridView vs. regular ImageButtonGridView 内的 ImageButton 与常规 ImageButton 的 OnClick 差异
【发布时间】：2011-06-23 20:36:39
【问题描述】：

我正在开发一个 ASP.NET/C# 项目，并且有一个 GridView 控件。其中一列是一个 TemplateField/ItemTemplate，里面有一个 ImageButton。在 OnClick 事件期间，我使面板可见。使用常规 ImageButton 执行此操作时，页面会重新加载并且面板可见。这不会发生在 GridView 内的 ImageButton 上。有谁知道我是怎么做到的，或者为什么会这样？

感谢您的宝贵时间，如果您有任何问题，请告诉我。

这是相关的asp定义

<asp:TemplateField ItemStyle-Width="90px"  ItemStyle-VerticalAlign ="Bottom" ItemStyle-HorizontalAlign ="Center" HeaderText="Add Alias">
                <HeaderStyle Font-Bold="True" Font-Size="11px" VerticalAlign="Bottom"/>
                    <ItemTemplate>
                        <asp:ImageButton ID ="btnAddAliasHeader" runat="server" ImageUrl="~/img/AddAlias.gif" onclick="btnAddAlias_Click" />
                 </ItemTemplate>
                </asp:TemplateField>

这是 OnClick 函数的 C#。

protected void btnAddAlias_Click(object sender, EventArgs e)
{
    ImageButton btnAddAlias = (ImageButton)sender;
    GridViewRow row = (GridViewRow)btnAddAlias.Parent.Parent;
    int rowIndex = row.RowIndex;

    lblSelectedCity.Text = gvResults.Rows[rowIndex].Cells[0].Text;
    lblSelectedCountry.Text = ddlCountry.Text;
    pnlAddAlias.Visible = true;

}

我添加了 OnRowCommand 事件并使面板在那里可见，但它仍然不显示。我认为这可能与回发有关，因为如果我然后单击 gridview 外部的按钮，则在重新加载时，gridview 内部按钮的面板显示正常。

编辑：我是个白痴，忽略了所有这些都发生在更新面板中。

【问题讨论】：

GridView 和 Panel 在同一个UpdatePanel 内吗？

标签： c# asp.net gridview imagebutton

【解决方案1】：

Buttons、ImageButtons 和 LinkButtons 在您描述的控制模板中时不会触发 Click 事件。（编辑：除非与控件的OnClick 属性一起使用）相反，包含控件会触发一个事件，在GridView 的情况下它是一个RowCommand 事件。使用按钮的CommandName 和CommandArgument 属性来确定要在事件处理程序中采取的正确操作，如下所示：

标记：

<asp:LinkButton ID="LinkButton1" runat="server" CommandName="DoStuff" CommandArgument='<%# Eval("RecordID") %>' Text="DoStuff"></asp:LinkButton>

代码：

Protected Sub GridView1_RowCommand(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewCommandEventArgs) Handles GridView1.RowCommand
    If e.CommandName = "DoStuff" Then
        'Do something with e.CommandArgument'
    End If
End Sub

【讨论】：

他们确实触发了他们的事件，但是我可以通过调试器走到他们发生的地方。对于 Gridview 中的 ImageButton，回发的工作方式是否不同？

【解决方案2】：

容器内的按钮/图像按钮，例如网格视图（列表视图、中继器等），其点击事件会冒泡到容器本身。要使面板可见，需要在按钮上使用命令名和命令参数属性，然后使用gridview的OnRowCommand事件来显示面板

HTH

【讨论】：

我添加了 OnRowCommand 事件并使面板在那里可见，但它仍然没有显示。我认为这可能与回发有关，因为如果我然后单击 gridview 外部的按钮，则在重新加载时，gridview 内部按钮的面板显示正常。
@Nick：正如伪编码器在他们对原始问题的评论中提到的那样，gridview 和面板是否都在同一个更新面板中？如果没有，那么您必须向包含您希望显示的面板的更新面板添加一个触发器。

【解决方案3】：

我假设你的事件没有触发 - 你应该使用 imagebutton 上的 commandname 属性 - 并在 gridview 的 onrowcommand 上选择它 - 或者在 onrowcreated 事件中注册你的 imagebutton 点击事件。

【讨论】：

【解决方案4】：

如果不需要回发。对不起，如果我误解了这个问题。您可以不使用图像按钮（服务器控件），而是使用包含在 a 标记和 jQuery 中的链接或常规图像。这将防止回发到服务器。希望这会有所帮助。

<a href="#" id="viewPanel">Click to View Panel</a>

$("#<%=viewPanel.ClientID%>").click(function(e)
{
    e.preventDefault();
    $("#id_of_panel").show();

});

希望这会有所帮助。

【讨论】：

他不是要求避免回发或运行客户端代码...？
@pseudocoder - 在我阅读问题后，他添加了代码。他还说他想让一个面板可见。如果不需要在服务器上进行处理，我会给他一个替代方案。

【解决方案5】：

您可以为 gridview 使用 Oncommand 事件，而不是在特定控件上使用 Onclick，您只需从控件传递命令名并通过 e.commandname 检查它并执行您想要执行的任何操作

【讨论】：