Easyui Datagrid扩展fixRownumber方法 转载
$.extend($.fn.datagrid.methods, {
fixRownumber : function (jq) {
return jq.each(function () {
var panel = $(this).datagrid("getPanel");
//获取最后一行的number容器,并拷贝一份
var clone = $(".datagrid-cell-rownumber", panel).last().clone();
//由于在某些浏览器里面,是不支持获取隐藏元素的宽度,所以取巧一下
clone.css({
"position" : "absolute",
left : -1000
}).appendTo("body");
var width = clone.width("auto").width();
//默认宽度是25,所以只有大于25的时候才进行fix
if (width > 25) {
//多加5个像素,保持一点边距
$(".datagrid-header-rownumber,.datagrid-cell-rownumber", panel).width(width + 5);
//修改了宽度之后,需要对容器进行重新计算,所以调用resize
$(this).datagrid("resize");
//一些清理工作
clone.remove();
clone = null;
} else {
//还原成默认状态
$(".datagrid-header-rownumber,.datagrid-cell-rownumber", panel).removeAttr("style");
}
});
}
});
//以下是空数据时候显 '未找到符合条件的数据',$(target).datagrid("fixRownumber");//自适应rownumber 放在最后调用
Easyui.$myview = $.extend({}, $.fn.datagrid.defaults.view, {
onAfterRender: function (target) {
$.fn.datagrid.defaults.view.onAfterRender.call(this, target);
var opts = $(target).datagrid('options');
var vc = $(target).datagrid('getPanel').children('div.datagrid-view');
vc.children('div.datagrid-empty').remove();
if (!$(target).datagrid('getRows').length) {
var d = $('<div class="datagrid-empty"></div>').html(opts.emptyMsg || 'no records').appendTo(vc);
d.css({
position: 'absolute',
left: 0,
top: 50,
width: '100%',
textAlign: 'center'
});
}
$(target).datagrid("fixRownumber");//自适应rownumber
}
});
Easyui.datagrid = function (/*object*/options) {
var $dg = $('#' + options.datagridId);
var _options = $.extend({
loadMsg: '数据加载中,请稍后……',
method: 'post',
pageList: [15, 20, 30, 50],
pageSize: 50,
toolbar: '#dg_toorbar',
fit: true,
pagination: true,
border: false,
rownumbers: true,
striped: true,
view: Easyui.$myview,
singleSelect: true,
fitColumns: true,
emptyMsg: '未找到符合条件的数据',
cache: false
}, options);
if (options.formId && $(options.formId).form('validate')) {
_options.queryParams = $(options.formId).form('serialize');
}
$dg.datagrid(_options);
};
Easyui Datagrid扩展fixRownumber方法 转载的更多相关文章
- Easyui Datagrid扩展fixRownumber方法
首先,从datagrid生成的代码,我们可以发现,在rowNumber上都有特定的class标记,datagrid-cell-rownumber,datagrid-header-rownumber. ...
- easyui datagrid 清除缓存方法
easyui datagrid 清除缓存方法 今天在项目中做了一个添加合同编号页面,添加合同编号了,在datagrid列表上没有显示刚才添加的那个合同编号. 这个问题在IE上特别明显. 原因是添加编号 ...
- easyui tree扩展tree方法获取目标节点的一级子节点
Easyui tree扩展tree方法获取目标节点的一级子节点 /* 只返回目标节点的第一级子节点,具体的用法和getChildren方法是一样的 */ $.extend($.fn.tree.meth ...
- Easyui datagrid 扩展单元格textarea editor
datagrid 扩展单元格textarea editor by:授客 QQ:1033553122 测试环境 jquery-easyui-1.5.3 问题描述 如下,在没有扩展的情况下,初始化如下 手 ...
- 给 Easyui Datagrid 扩展方法
$.extend($.fn.datagrid.methods, { /** * 更新 非编辑列值 * @param rowIndex : 行索引 * @param cellName : 列索引或列名 ...
- easyui datagrid属性和方法
本文可以当做api来使用 使用方法(Usage Example) 从现有的表单元素创建数据表格,定义在html中的行,列和数据. <table class="easyui-datagr ...
- Easyui datagrid扩展子网格detailview增删改查详解
话不多gang,先上代码,将以下三个属性插入主网格的初始化参数中: view : detailview, //1 detailFormatter : function(index, row) { // ...
- (转)扩展jquery easyui datagrid 之动态绑定列和数据
本文转载自:http://blog.csdn.net/littlewolf766/article/details/7336550 easyui datagrid 不支持动态加载列,上次使用的方法是自己 ...
- jquery EasyUI datagrid 的扩展
接触 easyui 半年,js学的不深.大神请路过. 直接扩展 添加方法: $.extend($.fn.datagrid.methods, { getSelectedIndex: function ( ...
随机推荐
- 【C/C++开发】c++ 工具库 (zz)
下面是收集的一些开发工具包,主要是C/C++方面的,涉及图形.图像.游戏.人工智能等各个方面,感觉是一个比较全的资源.供参考! 原文的出处:http://www.codemonsters.de/ho ...
- Shell脚本之二 变量、字符串和数组
一.Shell 变量 1.1 定义变量 定义变量时,变量名不加美元符号($),如: your_name="runoob.com" 注意,变量名和等号之间不能有空格,这可能和你熟悉的 ...
- jquery swipper插件的一些弊端
jquery swipper插件的一些弊端touch触摸机制是swipper的 阻止click冒泡.拖动Swiper时阻止click事件.下面这个方法或许可以解决触摸机制的问题 <pre> ...
- Android.mk基础
1.前言 Android.mk用于向编译系统描述源文件和共享库,它实际上是编译系统解析一次或多次的微小GNU makefile片段.它的语法支持将源文件分组为模块,模块是静态库.共享库或独立的可执行文 ...
- inode是什么?
理解inode,要从文件储存说起. 文件储存在硬盘上,硬盘的最小存储单位叫做"扇区"(Sector).每个扇区储存512字节(相当于0.5KB). 操作系统读取硬盘的时候,不会一个 ...
- 快速获取更丰富的Sitecore体验数据库
无论您是否立即使用Sitecore的营销功能,我们强烈建议您执行这三项任务,以使您的数据收集更加丰富,并为您以后的决策留下良好的位置. Sitecore的体验数据库,即xDB,是Sitecore营销平 ...
- Google大数据三篇著名论文中文版
Google File System中文版 Google MapReduce中文版 Google Bigtable中文版
- Java的常用API之包装类简介
包装类 包装类: 基本数据类型,使用起来非常方便,但是没有对应的方法来操作这些基本类型的数据可以使用一个类,把基本类型的数据装起来,在类中定义一些方法,这个类叫做包装类,我们可以使用类中的方法来操作这 ...
- Linux中的RCU的那点事
原文:https://zhuanlan.zhihu.com/p/67520807 今天来讲一下这Linux内核中的RCU(Read Copy Update,读复制更新)机制. 我主要参考的 ...
- Micro 设计文档
1.顶部 即时通讯 | 应用软件 | 网络学院 | 帮助中心 | 开发者中心 | 控制台 2.导航 首页 免费制作 免费下载 功能介绍 示例演示 云数据 支持与服务 免费制作:https://www. ...