`
yejian235
  • 浏览: 22787 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

Extjs4:给Grid的Column加上提示

 
阅读更多

在Grid中展示的内容超出column设定的宽度,如果鼠标移到单元格上能提示完整的内容,给人的感觉会相对友好些。
还是引用之前的例子《Extjs4:给Grid的Header加上提示》,在公司名称列,如果长度超过10,截取10个字符,加省略号显示,其实是引用上一次做例子《Extjs4:改变Grid单元格背景色》中最后提到的metaData中tdAttr,先看效果:

代码:

{
                    xtype: 'gridcolumn',
                    sortable: false,
                    dataIndex: 'company',
                    flex: 1,
                    text: '公司',
                    tooltip: '公司名称',
                    renderer: function(value, metaData, data) {
                    	var cname = value;
                    	if(value.length>10){
                    		 metaData.tdAttr = 'data-qtip="'+value+'"';
                    		cname = value.substring(0,10)+"...";
                    	}
                        return cname;
                    }
                }
分享到:
评论

相关推荐

    extjs设计实例包含Grid和布局的设计

    extjs设计实例包含Grid和布局的设计

    ExtJS4 Grid改变单元格背景颜色及Column render学习

    利用的是Column的render实现单元格背景颜色改变,本文给予了实现代码,感兴趣的朋友可以了解下,或许对你学习ExtJS4 Grid有所帮助

    EXTJS4 Actioncolumn不能使用文字的部分解决办法

    就是extjs4里面,想给grid里面一格中,文字后面加个小图标。 因为俺们项目就只是文字+图标,所以俺就没有复写Actioncolumn,而是从Column下面继承了一下。。 包含自定义插件源码、效果图等等。

    Ext jsGrid 锁列问题

    用于Ext开发Grid中遇到的所锁列的问题,这个很有帮助

    Extjs4.1.1

    第十七讲.ExtJS之Grid组件 第十八讲.ExtJS之ComboBox获取远程数据、网页计算器 第十九讲.ExtJS之组件面向对象编程(一) 第二十讲.ExtJS之组件面向对象编程(二) 项目实战Extjs版在线选课系统:

    关于extjs4如何获取grid修改后的数据的问题

    下面是API的描述。可以获取各种值。 e : Object An edit event with the following properties: •grid – The grid •record – The record that was edited •field – The ... •row – The grid table row •column

    extjs 04_grid 单击事件新发现

    EXTJS GRID 中 单击行和单元格获得行或者单元格的内容(数据) Js代码 代码如下: grid.addListener(‘cellclick’,cellclick); function cellclick(grid, rowIndex, columnIndex, e) { var record = grid.getStore()....

    ExtJs4.1 treegrid CRUD 读取、新增、修改、删除

    this.editingPlugin.startEditByPosition({row:arow,column:acol}); }, selcell2:function(node,acol){ this.editingPlugin.startEdit(node,acol); } //将grid更新为已保存状态(客户端) commit:function(records){...

    基于ExtJS3的后台管理系统模板

    3、通过实现角色管理、用户管理、部门管理三个基础的功能模块,演示了Viewport、Container、Panel、Grid、Window、Form、Tree等常用组件的用法,以及border、column、form、fit、accordion、hbox等常用布局方式;...

    ExtJs框架系列之ProgressGrid进度条

    ExtJs框架系列之ProgressGrid进度条

    Extjs exporter

    It's a fork from another project, I adapted it to work with ExtJs 4, using the new class system and fixed a couple of bugs. The Csv exporter isn't implemented and the example and compiled files are ...

    ExtJS5-一个简洁完整的后台管理系统入门实例

    4、通过实现角色管理、用户管理两个基础的功能模块,演示了Viewport、Container、Panel、TreePanel、Grid、Window、Form等常用组件的用法,以及border、column、form、fit、hbox等常用布局方式; 5、通过自定义一个...

    ExtJSWeb应用程序开发指南(第2版)

    3.2 信息提示框组件介绍 3.2.1 认识Ext.window.MessageBox 3.2.2 Ext.MessageBox.alert() 3.2.3 Ext.MessageBox.confirm() 3.2.4 Ext.MessageBox.prompt() 3.2.5 Ext.MessageBox.wait() 3.2.6 Ext....

    Ext.ux.grid.column.ActionButton:一个 Ext JS 5.x, 6.x Widget Column Extension 来处理网格行操作

    一个 ExtJS 5.x, 6.x Widget Column Extension,用于处理单个记录的网格行操作 根据网格行记录构建固定的和动态的下拉项 在 Ext JS 5.x 和 6.x 上测试 用法 将 ActionButton.js 文件放入您的 ux 路径中 重新创建类 ...

    ExtJs2.0简明教程

    我这是根据别人写的做成PDF文档 第一章 开始ExtJS………………………………………………………………………………………………………4 1.1 获得ExtJS……………………………………………………………………...

    Ext Js权威指南(.zip.001

    10.1.5 列标题的运行流程:ext.grid.column.column / 510 10.1.6 虚拟滚动条的工作原理:ext.grid.pagingscroller / 511 10.1.7 锁定列的运行流程:ext.grid.lockable与ext.grid.lockingview / 516 10.2 使用...

    unigui0.83.5.820

    0.83.4.819 +---------------------------------------------------------------------------------------- - 0000789: UniDBComboBox, UniDBListBox: Edit mode is not set when changed - 0000784: TUniStringGrid...

    ExtAspNet v2.2.1 (2009-4-1) 值得一看

    -Grid1.Columns.FindColumnById函数被Grid1.FindColumn所替代。 -为TreeCheckEventArgs,TreeExpandEventArgs,TreeCommandEventArgs增加Node属性。 -为所有控件增加Focus(覆盖Control默认的Focus函数)和...

    JavaScript中使用sencha gridpanel 编辑单元格、改变单元格颜色

    表格的列信息由类Ext.grid.Column(以前是由Ext.grid.ColumnModel定义)、而表格的数据存储器由Ext.data.Store定义,数据存储器根据解析的数据不同分为JsonStore、SimpleStroe、GroupingStore等。 下面

Global site tag (gtag.js) - Google Analytics