easyui datagrid 悬浮事件
easyui的单元格提示窗体 鼠标悬浮事件
function findAllPreven() {
var infoname = $('#area').val();
areadatagrid=$('#dg').datagrid({
rowStyler : function(index, row) {
if (row.state == "0") {
return 'color:red';
} else if (row.state == "1") {
return 'color:green';
}
},
url : '连接地址',
fit : true,
nowrap : true,
fitColumns : true,
idField : 'id',
pagination : true,
pageSize : 15,
pageList : [ 15, 25, 35, 45 ],
rownumbers : true,
sortName : 'id',
sortOrder : "desc",
toolbar: '#tb',
checkOnSelect : true,
ctrlSelect:true,
remoteSort : false,
title:"数据列表",
queryParams : {
area : infoname,
},
columns : [ [ {
field : 'id',
title : '选择',
width : 100,
align : 'center',
sortable : true,
checkbox : true,
}
,{
field : 'source',
title : '信息来源',
width : 100,
align : 'center',
sortable : true,
formatter:cellRowMark //悬浮
}
{
field : 'state',
title : '状态',
width : 100,
align : 'center',
sortable : true,
formatter:function(value,row,index){
if(value==0){
return "<span style='color:red'>未处理</span>";
}else if(value==1){
return "<span style='color:green'>已处理</span>";
}
else if(value==2){
return "<span style='color:black'>初处理</span>";
}
}
}
] ],
onLoadSuccess:function(){createTooltip();}, //初始化悬浮方法
onDblClickCell:function(rowIndex, field, value){
if(field=="source")
{
if(value=="")return;
}
else
{
var rowData=$('#dg').datagrid('getRows')[rowIndex];
}
}
});
}
//单元格
function cellRowMark(value,row,index){
return '<span getInfo='+index+' class="easyui-tooltip">' + value + '</span>';
}
//创建悬浮方法
function createTooltip(){
$('#dataGrid【表格名称】').datagrid('getPanel').find('.easyui-tooltip').each(function(){
var index = parseInt($(this).attr('getInfo'));
$(this).tooltip({
content: $('<div>双击该单元格显示人员信息<br/>双击其他单元格显示预警信息</div>'),
position:'right'
});
});
}
easyui datagrid 悬浮事件的更多相关文章
- JQuery easyui Datagrid 分页事件
easyui是Jquery中的一个轻量级UI插件,提供了一些诸如window.datagrid.button等控件.现在主要说说Datagrid中分页控件的使用. easyui中可以单独添加分页pag ...
- EasyUI DataGrid组织事件冒泡
在事件内部需要阻止的地方添加如下代码 ]; 解释: arguments.callee是获得我自定义的事件处理方法OnSelected的方法体. .caller是获得调用OnSelected的上层方法( ...
- EasyUI datagrid 过滤事件段
//dateTimeRange过滤扩展 $.extend($.fn.datagrid.defaults.filters, { dateRange: { /*onInit: function(targe ...
- EasyUi datagrid 单选框选中事件
Easyui datagrid中的单选框默认是这样定义的 columns: [[ { field: 'CK', title: '', checkbox: true, width: 30 }]]. 平常 ...
- EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他
原创 : EasyUI datagrid 明细表格中编辑框 事件绑定 及灵活计算 可根据此思路 扩展其他 转载,请注明出处哦!谢谢! 原创 : EasyUI datagrid 明细表格中编辑框 事件绑 ...
- 扩充 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- EasyUI中datagrid双击事件
EasyUI中datagrid双击事件 在jsp文件底部增加代码: <script type="text/javascript"> //数据表双击事件 $('#tabl ...
- 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件(onMouseOver/onMouseOut)
客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...
- easyui datagrid editor checkbox 单击事件
Easyui datagrid treegrid中能够为行追加checkbox元素.比如: $('#tt').treegrid({ url:'get_data.php', idField:'id', ...
随机推荐
- SDK接入(1)之Android Facebook SDK接入
SDK接入(1)之Android Facebook SDK接入 由于游戏已上线,且处于维护阶段,所以有空写写各种SDK接入过程和遇到的问题,也当作一种工作总结.SDK接入主流分为这么几类,登录.支付. ...
- Android系统属性简介
查看Android源码你会发现,代码中大量存在:SystemProperties.set()/SystemProperties.get():通过这两个接口可以对系统的属性进行读取/设置,顾名思义系统属 ...
- Dagger2 (三) 总结篇
一.Dagger2注入原理 Dagger2以自动生成代码的形式,帮助我们构建依赖图,在使用依赖的时候方便清晰,这里说明一点,在我们使用Dagger2的时候,绝大多数错误都是编译器就会暴漏出来,这也就决 ...
- Atitit.工作流 与 规则引擎
Atitit.工作流 与 规则引擎 1.1. 应用来说,通常分为三部分:界面.业务逻辑和存储1 1.2. 自定义操作系列1 1.3. 自定义按钮系列2 1.1. 应用来说,通常分为三部分:界面.业务逻 ...
- SQL Sever 博客文章目录(2016-07-06更新)
SQL Server方面的博客文章也陆陆续续的写了不少了,顺便也将这些知识点整理.归纳一下下.方便自己和他人查看. MS SQL 数据类型 三大数据库对比研究系列--数据类型 MS SQL 表和视图 ...
- Linux shell脚本编程(三)
Linux shell脚本编程 流程控制: 循环语句:for,while,until while循环: while CONDITION; do 循环体 done 进入条件:当CONDITION为“真” ...
- archlinux 加载loop模块,且设定loop设备个数
如果loop模块没有编译进内核就要先加载loop模块 modprobe loop 然后更改/etc/modprobe.d/modprobe.conf(有些文章写是在/etc/modprobe.conf ...
- 2.lvm动态逻辑卷
Lvm动态逻辑卷 一. 基本概念 LVM 把实际的物理磁盘数据映射到一个简单而灵活的虚拟逻辑存储视图上,藉以控制磁盘资源: 也就是重新考虑了管理文件系统和卷的方法,在文件系统管 ...
- PL/SQL连接错误:ora-12705:cannot access NLS data files or invalid environment specified
适合自己的解决方法: 排查问题: 1. 你没有安装Oracle Client软件.这是使用PL/SQL Developer的必须条件.安装Oracle Client后再重试.2. 你安装了多个Orac ...
- 基本shell编程【3】- 常用的工具awk\sed\sort\uniq\od
awk awk是个很好用的东西,大量使用在linux系统分析的结果展示处理上.并且可以使用管道, input | awk '' | output 1.首先要知道形式 awk 'command' fi ...