c# - 在 GridView 中的 ASCX 控件内的控件上使用 Javascript 显示隐藏。 (ASP.NET + JavaScript)

Question

我编写了一个网络用户控件(ascx)。在里面，有一个面板，我想在单击用户控件内的超链接时显示/隐藏该面板。

通常，只需执行以下操作即可轻松实现(onclick 属性将添加到预渲染时的超链接中):

 var PanelToShow = document.getElementById('<%=PanelInvoiceHasBeenCreated.ClientID %>');

    if (PanelToHide != null) {
        PanelToHide.style.display = 'none';
    }

但是因为 ascx 控件保存在 gridview 中，所以上面的代码将评估所有名为“PanelInvoiceHasBeenCreated”的控件(其中 gridview 中有很多)。它唯一起作用的时候是当 gridview 中有 1 行时。目前，使用我现有的代码，如果我单击任意行中的超链接，它会显示/隐藏 GridView 底行中的面板!

因此，我的问题是如何获得我需要在正确行的正确控件上显示/隐藏的实际的唯一 ID？？？？？？

提前致谢。

Answer 1

您可以在gridview的rowdatabound事件中执行此操作 像这样的东西

在 gridview rowdatabound 事件中编写以下代码

var usercontrol1=(userControl)e.item.findcontrol("usercontrol1");
var hyperLink1=(Hyperlink)usercontrol1.FindControl("hyperLink1");
var PanelInvoiceHasBeenCreated=(Panel)usercontrol1.FindControl("PanelInvoiceHasBeenCreated");

hyperLink1..Attributes.Add("onclick", "javascript:return ShowHidePanel('"+ PanelInvoiceHasBeenCreated.ClientID +"')"); 

你的aspx页面上的java脚本函数应该是这样的

<script type="text/javascript">
function ShowHidePanel(panelid)
{

var PanelToShow = document.getElementById('panelid');

    if (PanelToHide != null) {
        PanelToHide.style.display = 'none';
    }
return false;

}
</script>