html - 为什么我的 gridview ASP.NET 中有一个

问题描述

我有一个由 asp.net 生成的 gridview。我有一个使用 css 隐藏的 id 行。然而，这会导致视觉问题，这是有问题的问题。

我知道问题是由于 html 中的最后一个 td 看起来像这样 <td> </td>.

你能在这张图片上看到吗。

当我删除那行代码时，它可以工作，我的 gridview 看起来像这样。

为什么asp会生成此代码<td> </td>。我怎样才能删除它任何帮助将不胜感激谢谢。

这是我的gridview的代码

<asp:GridView ID="gvLocation" runat="server" AutoGenerateColumns="false" ShowFooter="true" 
            ShowHeaderWhenEmpty="true" AllowPaging="True" OnPageIndexChanging="gvLocation_PageIndexChanging"
            OnRowEditing="gvLocation_RowEditing" OnRowCancelingEdit="gvLocation_RowCancelingEdit"
            AllowSorting="true" onsorting="gvLocation_Sorting" ridLines="None" CssClass="mGrid" PagerStyle-CssClass="pgr" AlternatingRowStyle-CssClass="alt" CellPadding="3">
            <%-- Theme Properties --%>
            <Columns>  
                <asp:TemplateField HeaderText="Armario" SortExpression="armario">
                    <ItemTemplate>
                        <asp:Label CssClass="gridTextbox" ID="lblCloset" Text='<%# Eval("armario")%>' runat="server" />
                    </ItemTemplate>
                    <EditItemTemplate>
                        <asp:TextBox CssClass="gridTextbox" ID="txtCloset" Text='<%# Eval("armario")%>' runat="server" />
                    </EditItemTemplate>
                    <FooterTemplate>
                        <asp:TextBox CssClass="gridTextbox" ID="txtClosetFooter" runat="server" />
                    </FooterTemplate>
                </asp:TemplateField>  
                <asp:TemplateField HeaderText="Cajon" SortExpression="cajon">
                    <ItemTemplate>                       
                        <asp:Label CssClass="gridTextbox" ID="lblDrawer" Text='<%# Eval("cajon")%>' runat="server" />
                    </ItemTemplate>
                    <EditItemTemplate>
                        <asp:TextBox CssClass="gridTextbox" ID="txtDrawer" Text='<%# Eval("cajon")%>' runat="server" />
                    </EditItemTemplate>
                    <FooterTemplate>
                        <asp:TextBox  CssClass="gridTextbox" ID="txtDrawerFooter" runat="server" />
                    </FooterTemplate>
                </asp:TemplateField>       
                <asp:TemplateField>
                    <ItemTemplate>
                        <asp:ImageButton ImageUrl="~/Images/edit.png" runat="server" CommandName="Edit" ToolTip="Edit" Width="20px" Height="20px"/>
                        <asp:ImageButton ImageUrl="~/Images/delete.png" runat="server" CommandName="Delete" ToolTip="Delete" Width="20px" Height="20px"  OnClick="deleteItem"/>
                    </ItemTemplate>
                    <EditItemTemplate>
                        <asp:ImageButton ImageUrl="~/Images/save.png" runat="server" CommandName="Update" ToolTip="Update" Width="20px" Height="20px"  OnClick="updateItem"/>
                        <asp:ImageButton ImageUrl="~/Images/cancel.png" runat="server" CommandName="Cancel" ToolTip="Cancel" Width="20px" Height="20px"/>
                    </EditItemTemplate>
                    <FooterTemplate>
                        <asp:ImageButton ImageUrl="~/Images/addnew.png" ID="addNewLocation" runat="server" CommandName="AddNew" ToolTip="Add New" Width="20px" Height="20px" OnClick="addNew"/>
                    </FooterTemplate>
                </asp:TemplateField>
                 <asp:TemplateField HeaderText="ubicacion id" SortExpression="ubicacion_componente_id" ItemStyle-CssClass="hideGridColumn" HeaderStyle-CssClass="hideGridColumn">
                    <ItemTemplate>
                        <asp:Label CssClass="gridTextbox" ID="lblLocationID"  Text='<%# Eval("ubicacion_componente_id")%>' runat="server" />
                    </ItemTemplate>
                </asp:TemplateField>  
            </Columns>
        </asp:GridView>

添加这里是隐藏第一个 id 列的 css 的代码

.hideGridColumn
{
    display: none;
}

标签： htmlcssasp.netgridview

有 2 个解决方案供您删除多余的<td> </td>

Javascript 版本

var table = document.getElementById("mytable");
for (var i = 0; i < 3; i++) {
  for (var k = 0; k < 5; k++) {
    var str = table.rows[i].cells[k].innerHTML;
    str = str.replace(/(&nbsp;)*/g, '');
    if (str.length) alert(str);
  }
};

如何删除用javascript这种情况？

jQuery版本

$(function() {
  $("table tr").each(function() {
    var tds = $(this).find("td"); //find all td
    var descriptionTD = tds.eq(1); //get the td for the description

    //get the remaining tds that only contain "&nbsp;"
    var emptytds = tds.not(descriptionTD).filter(function() {
      return $(this).html() === "&nbsp;";
    });

    //if all the remaing tds are empty
    if (emptytds.length === tds.length - 1) {
      emptytds.remove();
      descriptionTD.prop("colspan", tds.length).prop("width", "100%");
    }
  });
});

删除具有的 <td> 并制作子标题

html - 为什么我的 gridview ASP.NET 中有一个

问题描述

解决方案

推荐阅读