首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >为什么在我的网格视图ASP.NET中有一个<td>&nbsp;</td>

为什么在我的网格视图ASP.NET中有一个<td>&nbsp;</td>
EN

Stack Overflow用户
提问于 2019-06-19 08:41:56
回答 2查看 852关注 0票数 0

我有一个由asp.net生成的网格视图。我有一个id行,我用css隐藏了它。然而,这会导致视觉问题,这里就是问题所在。

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

你可以在这张图上看到。

当我删除这行代码时,它可以工作,我的网格视图如下所示。

为什么asp会生成这个代码<td>&nbsp;</td>。我怎样才能移除它呢?如果能帮上忙,我将不胜感激,谢谢。

下面是我的网格视图的代码

<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;
}
EN

回答 2

Stack Overflow用户

发布于 2019-06-19 08:47:07

有两种解决方案可供您删除冗余<td>&nbsp;</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);
  }
};

How to remove   with javascript this case?

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%");
    }
  });
});

remove that has   and make sub header

票数 0
EN

Stack Overflow用户

发布于 2019-06-19 08:50:28

<td>&nbsp;</td>

这是推荐的模式,因为它可以在每个浏览器上运行。尝试不在Edge浏览器中运行表格,您将看到这破坏了表格布局。

 <td>/td>

Without ' '

<td>&nbsp;</td>

With ' '

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/56658693

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档