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

标签：

1. (function (){  
2. $.extend($.fn.datagrid.methods, {  
3. //显示遮罩  
4. loading: function(jq){  
5. return jq.each(function(){  
6. $(this).datagrid("getPager").pagination("loading");  
7. var opts = $(this).datagrid("options");  
8. var wrap = $.data(this,"datagrid").panel;  
9. if(opts.loadMsg)  
10. {  
11. $("<div class="datagrid-mask"></div>").css({display:"block",width:wrap.width(),height:wrap.height()}).appendTo(wrap);  
12. $("<div class="datagrid-mask-msg"></div>").html(opts.loadMsg).appendTo(wrap).css({display:"block",left:(wrap.width()-$("div.datagrid-mask-msg",wrap).outerWidth())/2,top:(wrap.height()-$("div.datagrid-mask-msg",wrap).outerHeight())/2});  
13. }  
14. });  
15. }  
16. ,  
17. //隐藏遮罩  
18. loaded: function(jq){  
19. return jq.each(function(){  
20. $(this).datagrid("getPager").pagination("loaded");  
21. var wrap = $.data(this,"datagrid").panel;  
22. wrap.find("div.datagrid-mask-msg").remove();  
23. wrap.find("div.datagrid-mask").remove();  
24. });  
25. }  
26. });  
27. })(jQuery);  

用方法

在datagrid的事件onLoadSuccess中添加

 

 

1. //显示进度条  
2. function showProcess(isShow, title, msg) {  
3.    if (!isShow) {  
4.         $.messager.progress(‘close‘);  
5.   
6.           return;  
7.   
8.    }  
9.    var win = $.messager.progress({  
10.          title: title,  
11.           msg: msg  
12.    });  
13. }  
14.   
15.     //弹出框以及系统消息框  
16. function showMsg(title, msg, isAlert) {  
17.     if (isAlert !== undefined && isAlert) {  
18.         $.messager.alert(title, msg);  
19.     } else {  
20.         $.messager.show( {  
21.             title : title,  
22.             msg : msg,  
23.             showType : ‘show‘  
24.         });  
25.     }  
26. }  
27.   
28. //确认框  
29.    function showConfirm(title, msg, callback) {  
30.     $.messager.confirm(title, msg, function(r) {  
31.         if (r) {  
32.             if (jQuery.isFunction(callback))  
33.   
34.                 callback.call();  
35.         }  
36.     });  
37. }  

 

 

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

标签：

原文地址：http://www.cnblogs.com/huangf714/p/5854774.html