///<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);//参数是i3 .下面说完整的例子数据库用的说nothwind  的表 Order Details Extendedview 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 οnmοuseοut="DropDiv();" οnmοuseοver="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> 

gridView 多余字符显示省略号...相关推荐

  1. css3文字一行或多行展示,多余文字省略号(学习)超出隐藏

    css3文字一行展示,多余文字省略号 重点: 一行展示: text-overflow: ellipsis; white-space: nowrap; overflow: hidden; 多行展示: o ...

  2. CSS 设置文字只显示一行,多余显示省略号

    CSS 设置文字只显示一行,多余显示省略号 .view-text{/**思路:1.设置inline-block属相2.强制不换行3.固定高度4.隐藏超出部分5.显示"--"*/di ...

  3. php截取字符串,带中文,多余的省略号代替

    function subtext($text, $length) {if(mb_strlen($text, 'utf8') > $length) {return mb_substr($text, ...

  4. 小程序七十二变之多余文本省略号显示

    废话不多说,之前写小程序碰到了一个问题,如何在 wxml 页面中截取数据? 1.wxs   取数据想必大家都会,不就是 substring 吗?但是这种方法在 wxml 页面中是无效的. 那还有 cs ...

  5. 【TextView】Android TextView显示省略号的问题(关于TextView maxLength 和maxEms的学习)

    1.TextView的属性maxLength和maxEms 1). maxLength 作用:设置TextView 文本显示的个数 理解:把text的字符取出来,截取了指定个数个字符,然后将截取的字符 ...

  6. CSS控制的内容超过容器宽度后显示省略号

    text-overflow:ellipsis属性在FF中是没有效果的. 同时应用: text-overflow:ellipsis; white-space:nowrap; overflow:hidde ...

  7. js 控制超出字数显示省略号

    //多余显示省略号 function wordlimit(cname, wordlength) {var cname = document.getElementsByClassName(cname); ...

  8. 用JS 控制文字两行 ,展示省略号(兼容谷歌 IE等各大浏览器)

    用JS 控制实现两行文字多出部分展示省略号(兼容谷歌 IE等各大浏览器) 先说一下思路,控制好外部DIV的宽度,然后自行计算要展示几行的height,( someHeight),判断是否高于想要的高度 ...

  9. css 多行文字超出部分省略号 一行文字超出部分省略号

    1.  <!-- 多行文字超出宽度部分省略号: 显示文字行数 隐藏多余的 文本多余显示省略号text-overflow:ellipsis)--> html: <div class=& ...

最新文章

  1. ​孙家广院士:大数据软件的机遇与挑战
  2. 主板噪音测试软件,工作噪音测试 - 三英战吕布?四款300元热门电源横评 - 超能网...
  3. 深入理解ROS技术 【3】ROS下的模块详解(129-180)
  4. java中什么是类型_什么是Java中基本数据类型?
  5. 给自己一个微笑,让生命带给我们更多的幸福。
  6. 前端JavaScripts基础知识点
  7. ubuntu 21.04 版本上 安装 sqlcmd
  8. 支付宝新版SDK-PC扫码支付-手机浏览器H5支付
  9. QTP和WinRunner区别
  10. 2013流行Python项目汇总
  11. java/01/java简介,java基本概念,java基本类型的划分
  12. SIA:全球半导体行业销售额7月达到454亿美元 创下月度纪录
  13. win10 windows按钮右键没有命令提示符
  14. nginx rewrite 实现二级域名跳转
  15. HTML:frame导航框架的实现方法
  16. 计算机主板设置语言,技嘉主板bios设置中文对照的方法步骤
  17. php高德根据ip获取经纬度,开放平台:高德地图获取经纬度
  18. window下diskpart给SD卡分区
  19. IntellIdea中的jsp中include出现乱码问题
  20. Node-RED教程(十五):工业仪表盘开发

热门文章

  1. JDK安装以及开发环境搭建
  2. POJ2253 Frogger(最短路径)
  3. div+css背景渐变色代码示例
  4. 关于类和对象的进一步讨论 C++
  5. android webview开启html5支持
  6. 原创:检查点的三种加入方式
  7. 2005年2月9日(星期三) 晚上,熱 - 大年初一,首次創作。
  8. 从Java到Kotlin(三)
  9. 高级图像去雾算法的快速实现。
  10. Spring Cloud搭建微服务架构----使用Zipkin做服务链路追踪