//jquery.datagrid 扩展
(function (){
$.extend($.fn.datagrid.methods, {
//显示遮罩
loading: function(jq){
return jq.each(function(){
$(this).datagrid("getPager").pagination("loading");
var opts = $(this).datagrid("options");
var wrap = $.data(this,"datagrid").panel;
if(opts.loadMsg)
{
$("<div class=\"datagrid-mask\"></div>").css({display:"block",width:wrap.width(),height:wrap.height()}).appendTo(wrap);
$("<div class=\"datagrid-mask-msg\"></div>").html(opts.loadMsg).appendTo(wrap).css({display:"block",left:(wrap.width()-$("div.datagrid-mask-msg",wrap).outerWidth())/,top:(wrap.height()-$("div.datagrid-mask-msg",wrap).outerHeight())/});
}
});
}
,
//隐藏遮罩
loaded: function(jq){
return jq.each(function(){
$(this).datagrid("getPager").pagination("loaded");
var wrap = $.data(this,"datagrid").panel;
wrap.find("div.datagrid-mask-msg").remove();
wrap.find("div.datagrid-mask").remove();
});
}
});
})(jQuery);

使用方法:

$("#dataGrid").datagrid("loadData",(function (){
$("#dataGrid").datagrid("loading");
return [];//[]需要加载的数据
})());

在datagrid的事件onLoadSuccess中添加

onLoadSuccess:function (){
$("#dataGrid").datagrid("loaded");
}

扩展easyui.datagrid,添加数据loading遮罩效果代码 --来自网摘收集的更多相关文章

  1. jQuery扩展easyui.datagrid,添加数据loading遮罩效果代码

    //jquery.datagrid 扩展加载数据Loading效果 (function (){ $.extend($.fn.datagrid.methods, { //显示遮罩 loading: fu ...

  2. JS-easyui 扩展easyui.datagrid,添加数据loading遮罩效果代码

    (function (){ $.extend($.fn.datagrid.methods, { //显示遮罩 loading: function(jq){ return jq.each(functio ...

  3. 扩展easyUI tab控件,添加加载遮罩效果

    项目里要用HighChart显示图表,如果返回的数量量太多,生成图表是一个很耗时的过程.tab控件又没有显示遮罩的设置(至少本菜是没有找到), Google了一下,根据另一个兄台写的方法,拿来改造了一 ...

  4. 谈谈easyui datagrid 的数据加载(转)

    这篇文章只谈jQuery easyui datagrid 的数据加载,因为这也是大家谈论最多的内容.其实easyui datagrid加载数据只有两种方式:一种是ajax加载目标url返回的json数 ...

  5. [转载]再次谈谈easyui datagrid 的数据加载

    这篇文章只谈jQuery easyui datagrid 的数据加载,因为这也是大家谈论最多的内容.其实easyui datagrid加载数据只有两种方式:一种是ajax加载目标url返回的json数 ...

  6. 再次谈谈easyui datagrid 的数据加载

    from:http://www.easyui.info/archives/204.html 这篇文章只谈jQuery easyui datagrid 的数据加载,因为这也是大家谈论最多的内容.其实ea ...

  7. 谈谈easyui datagrid 的数据加载

    文章目录 1url方式加载数据 1.1调用方式 1.2相关方法 1.3二次加载问题 2加载本地数据方式 2.1调用方式 2.2如何分页 2.3加载中效果 2.4如何不统计总数 这篇文章只谈jQuery ...

  8. 一步步实现 easyui datagrid表格宽度自适应,效果非常好

    一步步实现 easyui datagrid表格宽度自适应,效果非常好: 一.设置公共方法,使得datagrid的属性  fitColumns:true $(function(){ //初始加载,表格宽 ...

  9. jQuery EasyUI DataGrid Checkbox 数据设定与取值

    纯粹做个记录,以免日后忘记该怎么设定. 这一篇将会说明两种使用 jQuery EasyUI DataGrid 的 Checkbox 设定方式,以及在既有数据下将 checked 为 true 的该笔数 ...

随机推荐

  1. 【转载】ANSYS完全法与模态叠加法瞬态分析实例

    原文地址:http://www.caetecc.com/thread-2172-1-1.html ! 半脉冲载荷 --- 模态叠加法fini/clear,nostart/PREP7ET,1,BEAM4 ...

  2. QT常用资料

    QTableView介绍 Qt 自定义 滚动条 样式 QTableWidget控件总结  QTableWidget的使用和美工总结 QT__stylesheet__操作 QSS QT皮肤(QSS)编程 ...

  3. Struts2向值栈中压入属性的方式

    Struts2在初始化Action的时候会先向值栈中压入一个action对象,里面包含了各个属性,这些属性是怎么被压进去的?或者说是根据什么来压入的?直到2016年5月5日才理解,原来是在初始化act ...

  4. [转]PHP如何关闭notice级别的错误提示

    1.在php.ini文件中改动error_reporting改为: error_reporting=E_ALL & ~E_NOTICE 2.如果你不能操作php.ini文件,你可以使用如下方法 ...

  5. Spring源码解析 - AntPathMatcher

    文章摘要: 1. ant匹配规则 2. PathMatcher接口 3. 通过测试用例看AntPathMatcher的使用 ant匹配规则 AntPathMatcher如名使用的ant 的匹配规则,我 ...

  6. Javascript模式(第五章对象创建模式)------读书笔记

    一 命名空间模式 1 命名空间模式的代码格式 var MYAPP={ name:"", version:"1.0", init:function(){ } }; ...

  7. Ubuntu setup Static IP Address

    Change Ubuntu Server from DHCP to a Static IP Address If the Ubuntu Server installer has set your se ...

  8. Android学习笔记(十三)

    Android中的广播机制 Android提供了一套完整的API,允许应用程序自由地发送和接受广播. 发送广播的方法借助于Intent,接受广播的方法需要广播接收器(BroadcastsReceive ...

  9. NSOperationQueue与GCD的使用原则和场景

    首先,我们要明确NSOperationQueue与GCD之间的关系: NSOpertaionQueue用GCD构建封装的,是GCD的高级抽象. 其次,我们要区别两者的不同: GCD仅仅支持FIFO队列 ...

  10. 使用Group By注意事项

    当查询中存在group by子句时,select列表(或是having子句)中只能存在分组函数,或是出现在group by子句中的字段. 这里说的,"出现在group by子句中的字段&qu ...