GridView、Child GridView、多余的列不会消失吗？

我正在构建一个 GridView 控件，它封装了一个子 gridview。子 gridview 包含一个 div 标签，当用户在父 gridview 中选择一行时会显示该标签。然而，即使内容被隐藏，即 div 标签，也会添加一个额外的列 - 如何删除额外的列。在教程中它指出，通过添加</td></td>并开始一个新行<tr>这应该发生，但确实发生了（我还注意到作者关闭了网格线，所以我的假设是他实际上也有这个问题）。这是gridview，哦，我设置了可见状态itemtemplate to 'true'但 JavaScript 无法找到它。

<asp:GridView ID="GridView1" runat="server" AllowPaging="True" AllowSorting="True"
  AutoGenerateColumns="False" DataKeyNames="PublicationID" 
  DataSourceID="ObjectDataSource1" Width="467px" OnRowDataBound="GridView1_RowDataBound"
  Font-Names="Verdana" Font-Size="Small">
  <Columns>
    <asp:TemplateField>
      <ItemTemplate>
        <asp:CheckBox ID="PublicationSelector" runat="server" />
      </ItemTemplate>
    </asp:TemplateField>
    <asp:BoundField DataField="NameAbbrev" HeaderText="Publication Name" SortExpression="NameAbbrev" />
    <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" />
    <asp:BoundField DataField="State" HeaderText="State" SortExpression="State" />
    <asp:TemplateField HeaderText="Owners">
      <ItemTemplate>
       <asp:Label ID="Owners" runat="server"></asp:Label>
      </ItemTemplate>
      <ItemStyle HorizontalAlign="Center" />
    </asp:TemplateField>
    <asp:BoundField DataField="Type" HeaderText="Type" SortExpression="Type" />
    <asp:TemplateField>
      <ItemTemplate >
      </td></tr>
        <tr>
          <td colspan="7">
            <div id="<%# Eval("PublicationID") %>" style="display: none; position: relative">
              <asp:GridView ID="GridView2_ABPubs" runat="server" AutoGenerateColumns="false" Width="100%"
                Font-Names="Verdana" Font-Size="small">
                <Columns>
                  <asp:BoundField DataField="NameAbbrev" HeaderText="Publication Name" SortExpression="NameAbbrev" />
                </Columns>
              </asp:GridView>
            </div>
          </td>
        </tr>
      </ItemTemplate>
    </asp:TemplateField>
  </Columns>
</asp:GridView>

除了主网格视图中的额外列之外，它工作正常。

为了完整起见，这里有一个来源文章 http://www.aspboy.com/Categories/GridArticles/Hierarchical_GridView_With_Clickable_Rows.aspx（由于某种原因它不喜欢我的<a href>标签，以便复制和粘贴）。

要去掉多余的列，只需将其 css 样式设置为display: none。您可以通过将 CssClass 应用于TemplateField包含嵌套网格：

<asp:TemplateField HeaderStyle-CssClass="hidden-column" ItemStyle-CssClass="hidden-column" FooterStyle-CssClass="hidden-column">

这是我使用的 CssClass 的定义：

<style type="text/css">
  .hidden-column {
    display: none;
  }
</style>

注意：标记仍将位于 html 中，但至少不会可见。
在 IE 8.0、Google Chrome 2.0 和 Opera 10.0 下测试

更新：要消除双边框，只需将 id 和样式放在<tr>而不是<div>:

<tr id="<%# Eval("PublicationID") %>" style="display: none; position: relative">
  <td colspan="7">
    <div>
...

...并更改 javascript 中的显示block to table-row:

div.style.display = "table-row";  // not a div anymore!!