Easyui-datagrid groupview 点击行展开

来源:互联网 发布:淘宝国乐一号 编辑:程序博客网 时间:2024/06/05 03:15

这里写图片描述

默认groupview是点击前面的加号才展开里面的行,现在我们要做成点击行也能展开。

打开 datagrid-groupview.js

找到bindEvents这个方法,接下来进行改造:

bindEvents: function (target) {        var state = $.data(target, 'datagrid');        var dc = state.dc;        var body = dc.body1.add(dc.body2);        var clickHandler = ($.data(body[0], 'events') || $._data(body[0], 'events')).click[0].handler;        body.unbind('click').bind('click', function (e) {            debugger            var tt = $(e.target);            var expander = tt.closest('span.datagrid-row-expander');            var dgroup = tt.closest('div.datagrid-group');            if (expander.length) {                var gindex = expander.closest('div.datagrid-group').attr('group-index');                if (expander.hasClass('datagrid-row-collapse')) {                    $(target).datagrid('collapseGroup', gindex);                } else {                    $(target).datagrid('expandGroup', gindex);                }            } else if (dgroup.length) {                //group层点击事件                  var gcheckbox = tt.context.type != "checkbox" ? tt.find('input[type=checkbox]') : tt;                var gindex = dgroup.attr('group-index');                if (tt.context.type == "checkbox" || gcheckbox.length) {                    if (tt.context.type != "checkbox") {                        gcheckbox._propAttr('checked', !gcheckbox.is(":checked"));                    }                    var trs = state.dc.view2.find(gindex != undefined ? 'table.datagrid-btable:eq(' + gindex + ') tbody >tr' : 'table.datagrid-btable tbody >tr');                    for (var i = 0; i < trs.length; i++) {                        var tr = trs[i];                        var rowIndex = $(tr).attr("datagrid-row-index");                        var gchecked = $(gcheckbox).is(':checked');                        if (gchecked) {                            $(target).datagrid('checkRow', rowIndex);                        } else {                            $(target).datagrid('uncheckRow', rowIndex);                        }                    };                } else {                    expander = state.dc.view1.find('div.datagrid-group:eq(' + gindex + ') span.datagrid-row-expander');                    var gindex = dgroup.attr('group-index');                    if (expander.hasClass('datagrid-row-collapse')) {                        $(target).datagrid('collapseGroup', gindex);                    } else {                        $(target).datagrid('expandGroup', gindex);                    }                }            } else {                //先执行easyui本身事件                  clickHandler(e);                //判断是否是点击行                  var checkedTr = tt.closest('tr.datagrid-row');                if (tt.context.type == "checkbox" || checkedTr.length) {                    var rindex = checkedTr.attr('datagrid-row-index');                    if (rindex != undefined) {                        //比较是否全选                          var checks = checkedTr.parents('tbody').find('tr.datagrid-row-selected');                        var checkRows = checkedTr.parents('tbody').find('tr.datagrid-row');                        var gi = tt.parents('table').prevAll('div.datagrid-group').first().attr('group-index');                        var ca = checkRows.length == checks.length;                        state.dc.view1.find('div[group-index=' + gi + '] input[type=checkbox]')._propAttr('checked', ca);                    }                }            }            e.stopPropagation();        });    },

亲测有效哦~~

原创粉丝点击