仅当子网格有数据时，嵌套的 gridview 显示加/减以展开

Question

我正在使用这个经典脚本来显示加号/减号图标来展开子网格。因为并非我的上下文中的所有行都有数据，所以我只想为那些在子网格中有数据的行显示加号/减号。

这是我的脚本：

 <script type="text/javascript">
        $("[src*=plus]").live("click", function () {
            $(this).closest("tr").after("<tr><td></td><td colspan = '999'>" + $(this).next().html() + "</td></tr>")
            $(this).attr("src", "images/minus.png");
        });
        $("[src*=minus]").live("click", function () {
            $(this).attr("src", "images/plus.png");
            $(this).closest("tr").next().remove();
        });
    </script>

我用来加载数据的方法是触发数据集“GetData()”的 OnRowDataBound。

if (e.Row.RowType == DataControlRowType.DataRow)
    {
        string code = zeroLevelGrid.DataKeys[e.Row.RowIndex].Value.ToString();
        GridView firstLevelGrid = e.Row.FindControl("firstLevelGrid") as GridView;
        firstLevelGrid.DataSource = GetData(string.Format("thestring...", code));
        firstLevelGrid.DataBind();
    }

更新 这是它的 html 方面：

<asp:GridView ID="zeroLevelGrid" runat="server" AutoGenerateColumns="false" CssClass="Grid"
            DataKeyNames="Code" OnRowDataBound="OnRowDataBoundZeroLevel">
            <Columns>
                <asp:BoundField ItemStyle-Width="35px" DataField="Id" HeaderText="Id" />
                <asp:BoundField ItemStyle-Width="50px" DataField="Code" HeaderText="Code" />
                <asp:BoundField ItemStyle-Width="150px" DataField="Description" HeaderText="Description" />
                <asp:BoundField ItemStyle-Width="50px" DataField="Quantity" HeaderText="Quantity" />
                <asp:TemplateField>
                    <ItemTemplate>
                        <img alt="" style="cursor: pointer" src="images/plus.png" />
                        <asp:Panel ID="firstLevelPanel" runat="server" Style="display: none">
                            <asp:GridView ID="firstLevelGrid" runat="server" AutoGenerateColumns="false" CssClass="ChildGrid" DataKeyNames="Code" OnRowDataBound="firstLevelGrid_OnRowDataBound">
                                <Columns>
                                    <asp:BoundField ItemStyle-Width="35px" DataField="Id" HeaderText="Id" />
                                    <asp:BoundField ItemStyle-Width="50px" DataField="Code" HeaderText="Code" />
                                    <asp:BoundField ItemStyle-Width="150px" DataField="Description" HeaderText="Description" />
                                    <asp:BoundField ItemStyle-Width="50px" DataField="Quantity" HeaderText="Quantity" />
                                    <asp:TemplateField>
                                        <ItemTemplate>
                                          ...................

我怎样才能实现仅显示具有子网格的行的 pus/minus？

Answer 1

您可以在绑定内部网格的位置隐藏它。
使您的网格图像runat=server 以及您绑定内部gridview 的位置检查查询中的行数，如果它为零则隐藏它。

 var dataSource=GetData(string.Format("thestring...", code));
 //check number of rows here using count
 var count=dataSource.Count();
 if(count>0)
 {
     firstLevelGrid.DataSource = GetData(string.Format("thestring...", code));
     firstLevelGrid.DataBind();
 }
 else
 {
    //find you image and hide it
     var element = e.Row.FindControl("imageid");
    //hide it

 }

编辑 1

制作图片runat='server'

  <img alt="" style="cursor: pointer" src="images/plus.png" runat="server" id="img_expand" />

在后面的代码中

Image img=(Image)e.Row.FindControl("img_expand");
img.visisbility=fasle;