datagrid.celltips.js
/**
* Created with JetBrains WebStorm.
* User: cao.guanghui
* Date: 13-6-26
* Time: 下午11:27
* To change this template use File | Settings | File Templates.
*/
$.extend($.fn.datagrid.methods, {
/**
* 开打提示功能(基于1.3.3+版本)
* @param {} jq
* @param {} params 提示消息框的样式
* @return {}
*/
doCellTip:function (jq, params) {
function showTip(showParams, td, e, dg) {
//无文本,不提示。
if ($(td).text() == "") return;
params = params || {};
var options = dg.data('datagrid');
var styler = 'style="';
if(showParams.width){
styler = styler + "width:" + showParams.width + ";";
}
if(showParams.maxWidth){
styler = styler + "max-width:" + showParams.maxWidth + ";";
}
if(showParams.minWidth){
styler = styler + "min-width:" + showParams.minWidth + ";";
}
styler = styler + '"';
showParams.content = '<div class="tipcontent" ' + styler + '>' + showParams.content + '</div>';
$(td).tooltip({
content:showParams.content,
trackMouse:true,
position:params.position,
onHide:function () {
$(this).tooltip('destroy');
},
onShow:function () {
var tip = $(this).tooltip('tip');
if(showParams.tipStyler){
tip.css(showParams.tipStyler);
}
if(showParams.contentStyler){
tip.find('div.tipcontent').css(showParams.contentStyler);
}
}
}).tooltip('show');
};
return jq.each(function () {
var grid = $(this);
var options = $(this).data('datagrid');
if (!options.tooltip) {
var panel = grid.datagrid('getPanel').panel('panel');
panel.find('.datagrid-body').each(function () {
var delegateEle = $(this).find('> div.datagrid-body-inner').length ? $(this).find('> div.datagrid-body-inner')[0] : this;
$(delegateEle).undelegate('td', 'mouseover').undelegate('td', 'mouseout').undelegate('td', 'mousemove').delegate('td[field]', {
'mouseover':function (e) {
//if($(this).attr('field')===undefined) return;
var that = this;
var setField = null;
if(params.specialShowFields && params.specialShowFields.sort){
for(var i=0; i<params.specialShowFields.length; i++){
if(params.specialShowFields[i].field == $(this).attr('field')){
setField = params.specialShowFields[i];
}
}
}
if(setField==null){
options.factContent = $(this).find('>div').clone().css({'margin-left':'-5000px', 'width':'auto', 'display':'inline', 'position':'absolute'}).appendTo('body');
var factContentWidth = options.factContent.width();
params.content = $(this).text();
if (params.onlyShowInterrupt) {
if (factContentWidth > $(this).width()) {
showTip(params, this, e, grid);
}
} else {
showTip(params, this, e, grid);
}
}else{
panel.find('.datagrid-body').each(function(){
var trs = $(this).find('tr[datagrid-row-index="' + $(that).parent().attr('datagrid-row-index') + '"]');
trs.each(function(){
var td = $(this).find('> td[field="' + setField.showField + '"]');
if(td.length){
params.content = td.text();
}
});
});
showTip(params, this, e, grid);
}
},
'mouseout':function (e) {
if (options.factContent) {
options.factContent.remove();
options.factContent = null;
}
}
});
});
}
});
},
/**
* 关闭消息提示功能(基于1.3.3版本)
* @param {} jq
* @return {}
*/
cancelCellTip:function (jq) {
return jq.each(function () {
var data = $(this).data('datagrid');
if (data.factContent) {
data.factContent.remove();
data.factContent = null;
}
var panel = $(this).datagrid('getPanel').panel('panel');
panel.find('.datagrid-body').undelegate('td', 'mouseover').undelegate('td', 'mouseout').undelegate('td', 'mousemove')
});
}
});
datagrid.celltips.js的更多相关文章
- easyui的datagrid用js插入数据等编辑功能的实现
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- datagrid后台分页js.js
$(function () { gridbind(); bindData(); }); //表格绑定function gridbind() { $('#dg').datagrid({ title: ' ...
- datagrid后台分页js
$(function () { gridbind(); bindData(); }); //表格绑定function gridbind() { $('#dg').datagrid({ title: ' ...
- DevExtreme学习笔记(一) DataGrid中js分析
1.overviewjs采用 $(function() { $("#gridContainer").dxDataGrid({ dataSource: { store: { type ...
- 基于1.3.3版本tooltip的datagrid单元格tip实现
基于1.3.3版本tooltip的datagrid单元格tip实现 2013年05月25日 ⁄ datagrid ⁄ 共 6122字 ⁄ 评论数 26 ⁄ 被围观 7,033 views+ 文章目录 ...
- RDIFramework.NET框架Web中datagrid与treegrid控件自动生成右键菜单与列标题右键菜单
在实际应用中常可以看到数据展示控件有右键菜单的功能,对应的列标题也可以右键弹出快捷菜单设置指定列的显示与隐藏等功能.在我们的RDIFramework.NET Web框架中,只要是使用了EasyUI的D ...
- easyloader.js源代码分析
http://www.cnblogs.com/jasonoiu/p/easyloader_source_code_analysis.html Jquery easyui是一个javascript UI ...
- easyui datagrid使用
http://www.cnblogs.com/zgqys1980/archive/2011/01/04/1925775.html 加载相关js和css,因为easyui依赖jquery,所有加载eas ...
- easyui datagrid使用(好)
加载相关js和css,因为easyui依赖jquery,所有加载easyui前要先加载jquery,否则为提示找不到datagrid <!-- 加载jquery --> <scrip ...
随机推荐
- Intent的用法总结(不进你会后悔的)
下面列出几种Intent的用法 下面的代码片段通过谷歌搜索 Intent intent = new Intent(); intent.setAction(Intent.ACTION_WEB_SEARC ...
- JQuery 控制div滚动条保持最下
$("#session_show").animate({ scrollTop: $("#session_show").scrollHeight },1000); ...
- windows系统IIS环境下安装memcache的方法
1.首先下载memcached-1.2.1-win32.zip 下载地址http://download.csdn.net/detail/u011986449/8110579 这下是windows下的版 ...
- Iocomp控件教程之Pie Chart——饼状图控件
Pie Chart--饼状图控件(Pie Chart)以饼状图形式显示每一个项目内容所占的百分比比重.在设计时.能够使用属性编辑器加入或者移除项目以及更改属性值.在执行时.使用AddItem,Remo ...
- Android Service+Socket 联网交互
android中,联网操作有http连接和socket连接两大类.由于项目需要,我们采取的是Socket连接.鉴于平时连接频繁,因此把Socket连接放到Service里,需要从服务器端获取数据时,只 ...
- UDP Sockets in C#
UDP provides an end-to-end service different from that of TCP. In fact, UDP performs only two functi ...
- 算法笔记_138:稳定婚姻问题(Java)
目录 1 问题描述 2 解决方案 1 问题描述 何为稳定婚姻问题? 有一个男士的集合Y = {m1,m2,m3...,mn}和一个女士的计划X = {n1,n2,n3,...,nn}.每一个男士有 ...
- SQL SERVER: 合并相关操作(Union,Except,Intersect)
SQL SERVER: 合并相关操作(Union,Except,Intersect) use tempdb create table tempTable1 (id int primary key id ...
- Windows Phone ProgressRing 控件
在windows phone 8中,只有ProgressBar的控件,而没有圆环形的等待控件.今天我突发奇想,从Windows Store 的ProgressRing控件上copy下来的XAML 代码 ...
- MySQL-EXPLAIN用法详解
今天做一个订单任务, 其中需要查有无此订单号信息, 由于订单号是个列表, 所以想检测下如下语句的性能(主要在LIMIT 1上) "订单号 IN (订单号列表)" LIMIT 1 然 ...