EXTJS 4.2 实现 gridpanel 鼠标悬停单元格以提示信息的方式显示单元格内容。
由于gridpanel的单元格里的文字太多时候,都由省略号代替,就想实现如题的功能,经过反复实验,终于搞定了!直接上代码:
me.on('itemmouseenter', function (view, record, item, index, e, eOpts) {
if (view.tip == null) { //这块判断很重要,不能每次都创建个tooltip,要不显示会有问题。
view.tip = Ext.create('Ext.tip.ToolTip', {
// The overall target element.
target: view.el,
// Each grid row causes its own separate show and hide.
delegate: view.itemSelector,
// Moving within the row should not hide the tip.
// trackMouse: false,
// Render immediately so that tip.body can be referenced prior to the first show.
renderTo: Ext.getBody()
});
};
var gridColums = view.getGridColumns();
var column = gridColums[e.getTarget(view.cellSelector).cellIndex];
view.el.clean();
view.tip.update(record.data[column.dataIndex]);
});
解释下:这里截取主要的代码,实际中,就是监听你的表格itemmouseenter这个事件就行了! 效果如图!
EXTJS 4.2 实现 gridpanel 鼠标悬停单元格以提示信息的方式显示单元格内容。的更多相关文章
- 如何使用phantomJS来模拟一个HTML元素的鼠标悬停
如何使用phantomJS来模拟一个HTML元素的鼠标悬停 (How to use phantomJS to simulate mouse hover on a HTML element) 转 htt ...
- 实习小白笔记一(鼠标悬停、获取多选、提交修改、layer页面、单元格文字长度、json、分页、左连接)
①easyui 当鼠标悬停显示单元格信息: $(this).datagrid('doCellTip',{'max-width':'600px','delay':300}); ②jquery 获取che ...
- EasyUI Datagrid 鼠标悬停显示单元格内容 复制代码
EasyUI Datagrid 鼠标悬停显示单元格内容 ,halign:, align: 0 « 上一篇:LINQ to Entities 中的查询» 下一篇:去掉字符串中的非数字字符 posted ...
- EasyUI的Datagrid鼠标悬停显示单元格内容
功能描述:table鼠标悬停显示单元格内容 1.js函数 function hoveringShow(value) { return "<span title='" + va ...
- Selenium处理页面---弹窗、表格、鼠标悬停、frame、下拉框、上传文件
一.Selenium测试-常用页面处理 1.概述 UI自动化测试(GUI界面层):UI层是用户使用产品的入口,所有功能通过这一层提供给用户,测试工作大多集中在这一层,常见的测试工具有UFT.Robot ...
- CSS3鼠标悬停图片上浮显示描述代码
效果:http://hovertree.com/texiao/css3/20/ 效果图: 代码如下: <!doctype html> <html lang="zh" ...
- js设置鼠标悬停改变背景色
看了网上那么多的js鼠标悬停时事件,大多数的,说了那么多话,也没解决什么问题,现在直接贴上代码,以供参考 html: <div id="sign">this is te ...
- wpf ListView DataTemplate方式的鼠标悬停和选中更改背景色
今天使用wpf技术弄一个ListView的时候,由于需求需要,需要ListView显示不同的数据模板,很自然的使用了DataTemplate方式来定义多个数据模板,并在ListView中使用ItemT ...
- jQuery css3鼠标悬停图片显示遮罩层动画特效
jQuery css3鼠标悬停图片显示遮罩层动画特效 效果体验:http://hovertree.com/texiao/jquery/39/ 效果图: 源码下载:http://hovertree.co ...
随机推荐
- 【Xamarin For IOS 开发需要的安装文件】
官网安装文件下载: http://download.xamarin.com/XamarinforMac/Mac/xamarin.mac-2.0.1.64.pkghttp://download.xama ...
- BrainFuck语言生成器
还要求生成的代码比较快和短. 当然stackexchange上面给出了实现,java的 http://codegolf.stackexchange.com/questions/5418/brainfu ...
- Android 获取文件大小
android 获取文件夹.文件的大小 以B.KB.MB.GB 为单位 FileSizeUtil public class FileSizeUtil { ;//获取文件大小单位为B的double值 ; ...
- Android之ExpandableListView的属性(Group不展开)
1. 设置ExpandableListView 默认是展开的: 先实例化exListView 然后 exListView.setAdapter(exlvAdapter); //遍历所有group,将 ...
- 关于打开Eclipse时出现eclipse failed to create the java virtual machine与locking is not possible in the direc
原文转自:http://www.cnblogs.com/steararre/p/4037453.html 今天在机子上使用Eclipse时候打开发现这两个问题,通过查阅资料膜拜大神博客得知解决方法,特 ...
- [置顶] ProDinner体验
最近研究了MVC的经典案例ProDinner. 下载地址是:http://prodinner.codeplex.com/ 部署完毕后,看看效果怎么样: Meals的多选功能非常不错: Meal界面格外 ...
- this关键字的解析
this关键字的作用: 1.表示类中的属性. class Person{ // 定义Person类 private String name ; // 姓名 private int age ; // 年 ...
- openfire文件夹
插件开发 学习制作第一个 openfire 插件 http://www.cnblogs.com/jying/p/3683409.html 跟我一步一步开发自己的Openfire插件 http://bl ...
- 常用aliyun公共资源列表
公共DNS 223.5.5.5 223.6.6.6 源软件镜像站点 mirros.aliyun.com NTP服务器 unix like ntp1-7. ...
- (转)走进JVM,浅水也能捉鱼
这不是一篇描述jvm是什么的文章,也不介绍jvm跨平台的特性,也不是讲述jvm安全特性的文章,更不是讲解jvm指令操作,数据运算的文章,本文重点讲述类型的生命周期. 类型的生命周期涉及到:类的装载.j ...
