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"> </th>
<th scope="col">FIRST</th>
<th class="hidden" scope="col" style="width:0px;"> </th>
<th scope="col"> </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 代码隐藏列。
我正在使用来自这个 tutorial
的nested datagrids
expand/collapse 选项工作正常,但最后 datagrid
出现一个空白列,我无法理解它的含义...也无法使用 rowdatabound
隐藏在 datagrid
...
这是HTML代码
<tr align="center">
<th scope="col"> </th>
<th scope="col">FIRST</th>
<th class="hidden" scope="col" style="width:0px;"> </th>
<th scope="col"> </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 代码隐藏列。