在使用DataGrid时经常遇到单元格中的内容过长而导致文本的换行,这样使本来简洁的页面看上去非常乱。下面的方法可以解决这个问题。
当单元格的内容超出指定的长度后,截去多余的字,然后在鼠标停留在某个单元格上时,就显示全部的内容。
此方法有个缺点:每个单位格都是指定长度的。
//某个datagrid的ItemDataBound事件。
//上半部分设置鼠标悬停时的背景色
//下半部分才起作用
public void DataGrid1_ItemDataBound(object sender, DataGridItemEventArgs e)
{
if(e.Item.ItemType==ListItemType.Item || e.Item.ItemType==ListItemType.AlternatingItem)
{
Color color = this.DataGrid1.SelectedItemStyle.ForeColor;
string foreColor = string.Format("#{0:X2}{1:X2}{2:X2}", color.R, color.G, color.B);
color = this.DataGrid1.SelectedItemStyle.BackColor;
string backColor = string.Format("#{0:X2}{1:X2}{2:X2}", color.R, color.G, color.B);
// 如果没有设置选中项的颜色,则不设置鼠标效果
if(foreColor != "#000000" || backColor != "#000000")
{
e.Item.Attributes.Add("onmouseover", string.Format("oldItemForeColor=this.style.color;this.style.color='{0}';oldItemBackColor=this.style.backgroundColor;this.style.backgroundColor='{1}'", foreColor, backColor));
e.Item.Attributes.Add("onmouseout", "this.style.color=oldItemForeColor;this.style.backgroundColor=oldItemBackColor;");
}
e.Item.Cells[1].Text = "<div style='text-overflow : ellipsis; overflow : hidden;width:80px;' title='"+e.Item.Cells[1].Text+"'><nobr>" + e.Item.Cells[1].Text + "</nobr></div>";
e.Item.Cells[2].Text = "<div style='text-overflow : ellipsis; overflow : hidden;width:80px;' title='"+e.Item.Cells[2].Text+"'><nobr><a class=lan href='".Text)+"]+this.Request.ApplicationPath+@"/UpLoadFile/"+System.IO.Path.GetFileName(e.Item.Cells[7].Text)+"'>" + e.Item.Cells[2].Text + "</a></nobr></div>";
e.Item.Cells[3].Text = "<div style='text-overflow : ellipsis; overflow : hidden;width:80px;' title='"+e.Item.Cells[3].Text+"'><nobr>" + e.Item.Cells[3].Text + "</nobr></div>";
e.Item.Cells[4].Text = "<div style='text-overflow : ellipsis; overflow : hidden;width:80px;' title='"+e.Item.Cells[4].Text+"'><nobr>" + e.Item.Cells[4].Text + "</nobr></div>";
e.Item.Cells[5].Text = "<div style='text-overflow : ellipsis; overflow : hidden;width:90px;' title='"+e.Item.Cells[5].Text+"'><nobr>" + e.Item.Cells[5].Text + "</nobr></div>";
e.Item.Cells[6].Text = "<div style='text-overflow : ellipsis; overflow : hidden;width:90px;' title='"+e.Item.Cells[6].Text+"'><nobr>" + e.Item.Cells[6].Text + "</nobr></div>";
}
}