easyui datagrid 扩展 加载失败 及 异常数据提示

最新推荐文章于 2021-10-08 09:59:17 发布
最新推荐文章于 2021-10-08 09:59:17 发布
阅读量2k 收藏 1
点赞数 2
分类专栏： JQuery EasyUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/rrrgy236116/article/details/94395830
版权

if ($.fn.datagrid.methods) {
    $.extend($.fn.datagrid.methods, {
        outExcel: function (jq, params) {
            var defaults = {
                type: 0,//0:全部 1:当前页
                controllerName: "",
                actionName: "",
                conditions: {}
            }
            var model = $.extend(defaults, params);
            if (typeof (model.conditions) != 'object') {
                showMsg('无效的查询参数对象');
                return;
            }
            if (model.controllerName == "" || model.actionName == "") {
                showMsg("无效的页面参数");
                return;
            }
            return jq.each(function () {
                var $target = $(this);
                var options = $target.datagrid('options');
                var columns = options.columns[0];
                if (!columns || columns.length == 0) {
                    showMsg('无效的列集合');
                    return;
                }
                model.columns = JSON.stringify(columns);
                model.conditions = JSON.stringify(model.conditions);
                ajaxPost("/System/outExcel", model, function (data) {
                    data = JSON.parse(data);
                    if (data.state == "success") {
                        $('<form id="formExcel" method="post" action="/System/DownloadExcel?filename=' + data.content + '"></form>').appendTo('body').submit().remove();
                    }
                    else {
                        showMsg(data.content);
                    }
                })
            });
        }
    });

    /*
    加载数据失败提示
    */
    $.extend($.fn.datagrid.defaults, {
        onLoadError: function (data)
        {
            console.log('onloadError');
            console.log(data);
            $.messager.alert('提示信息', '请求异常', 'info');
            $(this).datagrid('loadData', { total: 0, rows: [] });
        },
        loadFilter: function (data) {
            //console.log(data);
            //{"total":27,"rows":[{"rowno_2":"1"},{"rowno_2":"2"}]}
            //{"state":"error","content":"用户登录异常,请重新登录"}
            if (data.state != undefined && data.state == "error") {
                var push = {
                    "total": 0,
                    "rows": ""// 当为[]会出现空的两行
                };
                showMsg(data.content);
                return push;
            }
            else
                return data;
        },
    });
    /*
        *增加空行 用于数据不足以填满整个列表
        *param jq datagrid对象
    */
    $.extend($.fn.datagrid.methods, {
        fillBlankRow: function (jq, options) {
            var defaults = {
                onResize: function () {
                    $(jq).datagrid("fillBlankRow");
                }
            };
            var params = $.extend({}, defaults, options);
            var grid = $(jq);
            var rows = grid.datagrid("getRows");
            var length = rows.length;
            if (length > 0) {
                var options = grid.datagrid("options");
                if (typeof (params.onResize) == "function") {
                    options["onResize"] = function () {
                        params.onResize();
                    }
                }
                var gpanel = grid.datagrid("getPanel");
                var gbody1 = gpanel.find(".datagrid-view1 .datagrid-body");
                var tbody1 = gbody1.find("table>tbody");
                var gbody2 = gpanel.find(".datagrid-view2 .datagrid-body").eq(0);
                var gbody2table = gbody2.find("table");
                var tbody2 = gbody2.find("table>tbody").eq(0);
                var column1s = grid.datagrid("getColumnFields", true);
                var column2s = grid.datagrid("getColumnFields");
                var td1s = "";
                var td2s = "";
                //先移除填充行
                if (gbody1 != undefined)
                    $(gbody1).find("tr[class='datagrid-blank-row datagrid-row datagrid-row-alt']").remove();
                if (gbody2 != undefined)
                    $(gbody2).find("tr[class='datagrid-blank-row datagrid-row datagrid-row-alt']").remove();
                var scrollHeight = $(gbody2)[0].scrollHeight;
                var gbody2_height = $(gbody2).height();
                var gbody2table_height = $(gbody2table).height();
                var h1 = gbody2_height - gbody2table_height;
                var h2 = scrollHeight - gbody2table_height;
                if (options.rownumbers == true && h1 > 0) {
                    td1s += "<td class='datagrid-td-rownumber'><div class=\"datagrid-cell-rownumber\"></div></td>";

                    if (column1s.length > 0) {
                        $.each(column1s, function (i, field) {
                            var opt = grid.datagrid("getColumnOption", field);
                            if (opt != null && !opt.hidden) {
                                if (opt.checkbox) {
                                    td1s += "<td field=\"" + field + "\"><div class=\"datagrid-cell-check\"></div></td>";
                                } else {
                                    td1s += "<td field=\"" + field + "\"><div class=\"datagrid-cell datagrid-cell-c1-" + field + "\"></div></td>";
                                }
                            }
                        });
                    }
                    var events = $._data(gbody1.children().get(0), 'events');
                    if (events != null) {
                        //重新绑定click、dblclick事件
                        var clickfunc = events.click[0].handler;
                        events.click[0].handler = function (e) {
                            var tt = $(e.target);
                            var tr = tt.closest("tr.datagrid-row");
                            if (tr.hasClass("datagrid-blank-row")) {
                                return;
                            }
                            clickfunc(e);
                        };
                        var dblclickfunc = events.dblclick[0].handler;
                        events.dblclick[0].handler = function (e) {
                            var tt = $(e.target);
                            var tr = tt.closest("tr.datagrid-row");
                            if (tr.hasClass("datagrid-blank-row")) {
                                return;
                            }
                            dblclickfunc(e);
                        };
                    }
                }
                if (tbody2.length > 0 && column2s.length > 0 && h2 > 0) {
                    $.each(column2s, function (i, field) {
                        var opt = grid.datagrid("getColumnOption", field);
                        if (opt != null && !opt.hidden) {
                            if (opt.checkbox) {
                                td2s += "<td field=\"" + field + "\"><div class=\"datagrid-cell-check\"></div></td>";
                            } else {
                                td2s += "<td  field=\"" + field + "\"><div class=\"datagrid-cell datagrid-cell-c" + (options.rownumbers == true ? "2" : "1") + "-" + field + "\"></div></td>";
                            }
                        }
                    });

                    var events = $._data(gbody2.get(0), 'events');
                    if (events != null) {
                        //重新绑定click、dblclick事件
                        var clickfunc = events.click[0].handler;
                        events.click[0].handler = function (e) {
                            var tt = $(e.target);
                            var tr = tt.closest("tr.datagrid-row");
                            if (tr.hasClass("datagrid-blank-row")) {
                                return;
                            }
                            clickfunc(e);
                        };
                        var dblclickfunc = events.dblclick[0].handler;
                        events.dblclick[0].handler = function (e) {
                            var tt = $(e.target);
                            var tr = tt.closest("tr.datagrid-row");
                            if (tr.hasClass("datagrid-blank-row")) {
                                return;
                            }
                            dblclickfunc(e);
                        };
                    }
                }
                if (td1s != "") {
                    var tr = '<tr class="datagrid-blank-row datagrid-row datagrid-row-alt" style="height:' + h1 + 'px;" >' + td1s + '</tr>';
                    $(tr).appendTo(tbody1);
                }
                if (td2s != "") {
                    var tr = '<tr class="datagrid-blank-row datagrid-row datagrid-row-alt" style="height:' + h2 + 'px;background:#FFFFFF;border-bottom:0;">' + td2s + '</tr>';
                    $(tr).appendTo(tbody2);
                }
            }
        }
    });
}

 

无名大白
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
扩展easyui.datagrid，添加数据loading遮罩效果代码
12-09
在使用的过程中，发现easyui目前还缺少一些小功能或是未开放出来 拿datagrid插件来说，数据加载提供了两...分析easyui的datagrid代码，削离出其中远程数据加载时遮罩显示代码，并扩展datagrid的方法，代码如下： 代码如
easyui datagrid 增加鼠标悬停弹窗事件
08-21
EasyUI的Datagrid是一个强大的表格组件，它可以显示大量数据并支持排序、分页、过滤和编辑等功能。在Web应用中，Datagrid常用于展示结构化的数据，使用户能够高效地浏览和操作信息。 2. **鼠标悬停事件**： 在...
EasyUI技巧——DataGrid组件的错误统一处理
夫礼者的专栏
02-01 1707
EasyUI的DataGrid控件的错误处理。
关于EasyUI datagrid 无法在dialog中显示的问题分析及解决方案！
aerkv86628的专栏
08-31 329
最近项目中引用了easyUI，很大程度上的简化了开发过程，但是随之而来的也遇到一些问题，比如：标题中遇到的问题，去网上搜罗了下关于这个问题的解决方案，不是说的很复杂就是干脆文不对题，国外的使用这种稍微过时的UI框架就更少了，于是没办法就自己研究了，没有优化之前的图片大家参考下，数据都有就是无法显示，里面的内容全部不见了;网上很多人的解决方案是：新开一个页面并且使用iframe链接过...
初次使用EasyUI框架插件遇到的问题及总结
weixin_33748818的博客
11-07 445
由于公司做的系统大部分是后台系统，系统中列表居多；EasyuUI的datagrid这个插件对列表处理的还是很好的，满足公司的大部分列表需求了。使用easyui框架也是进入现在的公司之后采用到的。关于EasyuUI的datagrid可以在已有的表格元素创建数据网格（datagrid），在 html 中定义列、行及数据；也可以通过js来动态创建数据网格。关于如何创建看EasyUI的官网就可以了，比较简...
EasyUI(5) $.fn.datagrid.methods[_86e] is not a function(easyui扩展插件冲突错误)
郑清
12-04 8102
出现如下错误：$.fn.datagrid.methods[_86e] is not a function 在项目中我出现的问题是使用可编辑表格扩展插件(Cell Editing in DataGrid)的时候没有相应的效果 后来发现是和datagrid-扩展列信息中的 jeasyui.extensions.datagrid.tooltip.js 插件冲突 解决方法: --> 在to...
easyui中datagrid执行loadData方法出现异常
mhx123456789的博客
10-08 263
easyui中datagrid执行loadData方法出现异常
简介EasyUI datagrid editor combogrid搜索框的实现
09-02
总结起来，实现EasyUI datagrid editor中的combogrid搜索框，关键在于扩展datagrid的编辑器功能以支持combogrid，以及正确地定位并操作combogrid的grid对象。通过CSS类选择器，我们可以在编辑器环境中有效地处理和...
easyui datagrid 右冻结
04-18
1. **理解EasyUI datagrid**：首先，你需要熟悉EasyUI datagrid的基本用法，包括其初始化、数据加载、列配置等。 2. **分析源码**：查看easyui的源代码，找到处理表格滚动的部分，理解其工作原理。 3. **创建固定...
easyUI 属性总结
狼魂之力
07-30 1787
1、div easyui-window 生成一个window窗口样式。 属性如下： 1)modal:是否生成模态窗口。true[是] false[否] 2)shadow:是否显示窗口阴影。true[显示] false[不显示] 2、div easyui-panel 生成一个面板。 属性如下: 1)title:该标题文本显示在面板头部。 2)iconCls:在面板上通过一个CSS类显示16x16图标。 3)width:设置面板宽度。默认auto。 4)height:设置面板高
easyui数据窗口datagrid的数据加载问题
loowooowool的博客
08-18 667
今天在一个JSP页面内需要引用数据窗口，但写好JSP页面和对应的控制器方法后，发现页面其他部位严重错位，显示不正常，在经过一番调整后，页面可以正常显示后，发现easyui的datagrid没有正常获得到数据库中的数据，以下是个人的一些总结，仅供参考。       一、页面不正常先用浏览器调试，根据浏览器报错获得出错文件，如果无法直观找到代码语法错误或书写失误，用二分法依次排查。       二
easyui datagrid 避免初始化就加载数据
shandalue的专栏
07-15 8041
datagrid如果再初始化的时候添加了url属性，就会自动从后台加载数据，要想解决这个问题，就 1.初始化是不加url属性 2.需要加载数据的时候通过以下代码加载数据： _teacherCourseGrid.datagrid('options').url = teacherCourseUrl.teacherCourse; _teacherCourseGrid.datagrid('lo
easyui datagrid 延迟加载
最新发布
10-06
无论使用哪种方式，当datagrid加载数据时，会显示一个加载提示，用户可以通过设置加载提示的内容以及样式来提升用户体验。例如： ``` $('#datagrid').datagrid({ url: 'http://example.com/data', loadMsg: '数据...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值