GridView 多余字符显示省略号,并在Tooltip中显示完整信息

时间:2023-03-08 17:34:42

效果

GridView 多余字符显示省略号,并在Tooltip中显示完整信息


方法一:TemplateField

关键点

  1. TemplateField的灵活性
  2. CSS:overflow:hidden;text-overflow:ellipsis (溢出时隐藏;文本溢出时省略号;文本不换行)

code

<asp:TemplateField HeaderText="MAC">
<ItemTemplate>
<div style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:80px;">
<asp:Label ID="LabelMAC" runat="server" Text='<%# Eval("Equip_MAC") %>' Tooltip='<%# Eval("Equip_MAC") %>'></asp:Label>
</div>
</ItemTemplate>
<HeaderStyle Wrap="false" Width="80" HorizontalAlign="Left"></HeaderStyle>
<ItemStyle Wrap="false" Width="80"></ItemStyle>
</asp:TemplateField>

参考链接


方法二:RowDataBound

关键点

  1. RowDataBound事件
  2. Title(Tooltip)属性
  3. css

code

.GridView是GridView的class

与参考链接中的情况不同:我只对第7列进行了处理,且弃用了RowCreated事件改用CSS

.GridView{
table-layout: fixed;
} .GridView td{
word-break:break-all;
} .GridView td:nth-child(7){
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
protected void GridViewEquip_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)//数据行
{
TableCell cellMAC = e.Row.Cells[6];
cellMAC.ToolTip = cellMAC.Text;
}
}

参考链接