Datagrid 在 ASP NET C# 中显示末尾不需要的空白列

Datagrid show a blank column not required at the end in ASP NET C#

我正在使用来自这个 tutorial

nested datagrids

expand/collapse 选项工作正常,但最后 datagrid 出现一个空白列,我无法理解它的含义...也无法使用 rowdatabound 隐藏在 datagrid...

这是HTML代码

<tr align="center">
    <th scope="col">&nbsp;</th>
    <th scope="col">FIRST</th>
    <th class="hidden" scope="col" style="width:0px;">&nbsp;</th>
    <th scope="col">&nbsp;</th>
</tr>

任何帮助将不胜感激...我的代码如下...谢谢...

.javascript

function divexpandcollapse(divname) {
    var div = document.getElementById(divname);
    var img = document.getElementById('img' + divname);
    if (div.style.display == "none") {
        div.style.display = "inline";
        img.src = "/aspnet/img/minus.png";
    } else {
        div.style.display = "none";
        img.src = "/aspnet/img/plus.png";
    }
}

.aspx 标记

<%--START GRIDVIEW --%>
<asp:GridView ID="gvProducts"
    AutoGenerateColumns="False" runat="server"
    DataKeyNames="sID">
    <AlternatingRowStyle CssClass="altrows" />
    <Columns>
       
       <%--EXPANDED ROW NESTED GRIDVIEW --%>
        <asp:TemplateField ItemStyle-Width="10" ItemStyle-CssClass="ddl_Class_new">
            <ItemTemplate>
                <a href="JavaScript:divexpandcollapse('div<%# Eval("sID") %>');">
                    <img id="imgdiv<%# Eval("sID") %>"
                        src="/aspnet/img/plus.png" alt="" /></a>
            </ItemTemplate>
        </asp:TemplateField>

       <asp:BoundField ItemStyle-CssClass="ddl_Class_new"
           ItemStyle-HorizontalAlign="Center"
           DataField="FIRST"
           HeaderText="FIRST"
           ReadOnly="true"
           HtmlEncode="false" />                    

       <%--START NESTED GRIDVIEW --%>
        <asp:TemplateField>
            <ItemTemplate>
                <tr>
                    <td colspan="100">
                        <div id="div<%# Eval("sID") %>"
                            style="overflow: auto; display: none; position: relative; left: 3px; overflow: auto">
                            <asp:GridView ID="gv_Child" runat="server"
                                AutoGenerateColumns="false"
                                DataKeyNames="sID"
                                CssClass="mGrid" HorizontalAlign="Center">
                                <Columns>
                                    <asp:BoundField ItemStyle-CssClass="ddl_Class_new"
                                        ItemStyle-HorizontalAlign="Center"
                                        DataField="SECOND"
                                        HeaderText="SECOND"
                                        ReadOnly="true"
                                        HtmlEncode="false" />
                                </Columns>
                            </asp:GridView>
                        </div>
                    </td>
                </tr>
            </ItemTemplate>
        </asp:TemplateField>
        <%--END NESTED GRIDVIEW --%>
    </Columns>
</asp:GridView><%--END GRIDVIEW --%>

Return 浏览器中的数据网格 Chrome

CSS风格

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <style>
        th:nth-child(3), td:nth-child(3) {
            display: none;
        }
    </style>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">

//Gridview

</asp:Content>
<style>
    th:nth-child(3), td:nth-child(3) {
        display: none;
    }
</style>

使用此 CSS 代码隐藏列。