///<summary>
/// 多余的字用...显示
///</summary>
///<param name="GridView1"></param>
///<param name="title">要缩略显示的数据列名称</param>
///<param name="cell">位于gridView表格的列</param>
///<param name="pageNum">一页中要显示的数据项个数</param>
///<param name="len">字符长度</param>
public static void viewStr(GridView GridView1,DataTable dt, string title,int cell,int pageNum,int len)
{
if (GridView1.Rows.Count-1 > 0)
{
for (int i = 0; i <= GridView1.Rows.Count - 1; i++)
{
DataRowView row;
string str = "";
if (GridView1.PageIndex == 0)
{
row = dt.DefaultView[i];
str = Convert.ToString(row[title]);
GridView1.Rows[i].Cells[cell].Text = subStr(str, len);
}
else
{
row = dt.DefaultView[i + pageNum * GridView1.PageIndex];
str = Convert.ToString(row[title]);
GridView1.Rows[i].Cells[cell].Text = subStr(str, len);
}
}
}
}
private static string subStr(string str, int leng)
{
if (str.Length <= leng)
{
return str;
}
string sNewStr = str.Substring(0, leng);
sNewStr = sNewStr + "...";
return sNewStr;
}
GridView 长文本显示省略号 概述：1.gridview某列文本长度超过某值显示省略号 2.但鼠标移动到该列单元格时弹出div层，显示全部信息 其实网上有很类似到资料，不过没有看见完整的，容易用的，所以也小费了点力气！ 1. gridview某列文本长度超过某值显示省略号 主要说利用服务器端绑定数据时做字符串处理，过长到显示“......”省略号。同时完整信息存放在一个隐藏到div中，为2步做准备。 绑定的处理代码（详细看下面到例子） view plaincopy to clipboardprint? <%# Eval("ProductName").ToString().Length > 10 ? Eval("ProductName").ToString().Substring(0,10) + "..." : Eval("ProductName").ToString() %> <%# Eval("ProductName").ToString().Length > 10 ? Eval("ProductName").ToString().Substring(0,10) + "..." : Eval("ProductName").ToString() %> 其中ProductName 是绑定到数据库表到列名。 注意：必须用Eval绑定，用Bind绑定数据会出现错误，绑定数据最好用模板列，这样在模板列中插入lable标签来显示数据，因为lable标签有tootip属性，可以用它来显示完整的内容，而本身的text属性绑定带“...”的内容 例子： <asp:TemplateField HeaderText="文件编号"> <HeaderTemplate> 文件编号<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/images/PageImage/arrow_up.gif" CommandName="X" CommandArgument="FileNumber" /> </HeaderTemplate> <ItemTemplate> <asp:Label ID="Label1" runat="server" ToolTip='<%# Bind("FileNumber") %>' Text='<%# Bind("FileNumber") %>'></asp:Label> </ItemTemplate> <ItemStyle Width="100px" /> </asp:TemplateField> 2.鼠标移动到该列单元格时弹出div层，显示全部信息 当鼠标移动到该列到单元格时触发onmouseover事件，获取鼠标的坐标用来初始化div到坐标。用document.createElement()创建div元素，设置div到属性，最主要到是 position:absolute(这里用div分层应该能做不过对这个还不熟悉)。在onmouseout的处理方法中删除该div：view plaincopy to clipboardprint? document.body.removeChild(div_green);//参数是i document.body.removeChild(div_green);//参数是i 3 .下面说完整的例子 数据库用的说nothwind 的表 Order Details Extended view plaincopy to clipboardprint? <%@ Page Language="C#" AutoEventWireup="true" CodeFile="GridviewDiv.aspx.cs" Inherits="GridviewDiv" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>无标题页</title> <mce:style type="text/css"><!-- .menuClass { background-color:green; filter:alpha(opacity=50); margin-top:-2; width:98px; position:absolute; } --></mce:style><style type="text/css" mce_bogus="1">.menuClass { background-color:green; filter:alpha(opacity=50); margin-top:-2; width:98px; position:absolute; }</style> <mce:script type="text/javascript" language ="javascript"><!-- function ShowRec() { //取得鼠标坐标 var x,y; if(!document.all) { x=pageX; y=pageY; } else { x=document.body.scrollLeft+event.clientX; //鼠标X轴的值 y=document.body.scrollTop+event.clientY; //鼠标Y轴的值 // alert(x+"--"+y) } //创建div 设定它到属性 var div = document.createElement("div"); div.style.top = y-10; div.style.left = x+10; // div.style.background="green"; div.id="div_green"; div.className = "menuClass";//层样式 document.body.appendChild(div); //获取存放完整信息的div var ele = event.srcElement; var rec = ele.nextSibling; div.innerHTML =rec.innerHTML ; // var ele = event.srcElement; // var rec = ele.nextSibling; // rec.style.display = ''; // if(rec) // { // if(rec.style.display ='none') // { // rec.style.display = ''; // } // else // { // rec.style.display ='none'; // } // } } function DropDiv() { //删除div document.body.removeChild(div_green);//参数是i } // --></mce:script> </head> <body> <form id="form1" runat="server"> <div> <asp:GridView ID="GridView2" runat="server" AutoGenerateColumns="False" DataKeyNames="OrderID,ProductID" DataSourceID="SqlDataSource1" Width="399px" AllowPaging="True"> <Columns> <asp:BoundField DataField="OrderID" HeaderText="OrderID" ReadOnly="True" SortExpression="OrderID" /> <asp:BoundField DataField="ProductID" HeaderText="ProductID" ReadOnly="True" SortExpression="ProductID" /> <asp:BoundField DataField="ProductName" HeaderText="ProductName" SortExpression="ProductName" > </asp:BoundField> <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" SortExpression="UnitPrice" /> <asp:BoundField DataField="Quantity" HeaderText="Quantity" SortExpression="Quantity" /> <asp:BoundField DataField="Discount" HeaderText="Discount" SortExpression="Discount" /> <asp:BoundField DataField="ExtendedPrice" HeaderText="ExtendedPrice" ReadOnly="True" SortExpression="ExtendedPrice" /> <asp:TemplateField HeaderText="标题" SortExpression="ProductName"> <ItemTemplate> <a onmouseout="DropDiv();" onmouseover="ShowRec();" > <%# Eval("ProductName").ToString().Length > 10 ? Eval("ProductName").ToString().Substring(0,10) + "..." : Eval("ProductName").ToString() %> </a> <div id="divRec" style="display:none" mce_style="display:none"> <%# DataBinder.Eval(Container.DataItem, "ProductName")%> </div> </ItemTemplate> <ItemStyle Width="360px" Wrap="False" /> </asp:TemplateField> </Columns> </asp:GridView> <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>" SelectCommand="SELECT * FROM [Order Details Extended]"></asp:SqlDataSource> </div> </form> </body> </html>
posted on
