jquery easyui datagrid列支持绑定嵌套对象

1、参考https://www.cnblogs.com/zxdBlog/p/3584586.html

http://www.jeasyui.com/tutorial/datagrid/datagrid22.php

但是第一个链接中的方法的问题是,在鼠标拖大列标题时,下面的列表不会跟随移动,发现第二链接中的方法没有这个问题,所以修改如下

2、easyui版本1.5.4.5,修改后的代码如下

easyuifix.innerobject_datagrid = function () {
    if ($.fn.datagrid) {
        $.fn.datagrid.defaults.view = $.extend({}, $.fn.datagrid.defaults.view, {
            renderRow: function (target, fields, frozen, rowIndex, rowData) {
                var opts = $.data(target, 'datagrid').options;

                var cc = [];
                if (frozen && opts.rownumbers) {
                    var rownumber = rowIndex + 1;
                    if (opts.pagination) {
                        rownumber += (opts.pageNumber - 1) * opts.pageSize;
                    }
                    cc.push('<td class="datagrid-td-rownumber"><div class="datagrid-cell-rownumber">' + rownumber + '</div></td>');
                }
                for (var i = 0; i < fields.length; i++) {
                    var field = fields[i];
                    var col = $(target).datagrid('getColumnOption', field);
                    if (col) {
                        var fieldSp = field.split(".");
                        var value = rowData[fieldSp[0]];
                        for (var j = 1; j < fieldSp.length; j++) {
                            value = value[fieldSp[j]];
                        }

                        var css = col.styler ? (col.styler(value, rowData, rowIndex) || '') : '';
                        var classValue = '';
                        var styleValue = '';
                        if (typeof css == 'string') {
                            styleValue = css;
                        } else if (cc) {
                            classValue = css['class'] || '';
                            styleValue = css['style'] || '';
                        }
                        var cls = classValue ? 'class="' + classValue + '"' : '';
                        var style = col.hidden ? 'style="display:none;' + styleValue + '"' : (styleValue ? 'style="' + styleValue + '"' : '');

                        cc.push('<td field="' + field + '" ' + cls + ' ' + style + '>');

                        if (col.checkbox) {
                            style = '';
                        } else if (col.expander) {
                            style = "text-align:center;height:16px;";
                        } else {
                            style = styleValue;
                            if (col.align) { style += ';text-align:' + col.align + ';' }
                            if (!opts.nowrap) {
                                style += ';white-space:normal;height:auto;';
                            } else if (opts.autoRowHeight) {
                                style += ';height:auto;';
                            }
                        }

                        cc.push('<div style="' + style + '" ');
                        if (col.checkbox) {
                            cc.push('class="datagrid-cell-check ');
                        } else {
                            cc.push('class="datagrid-cell ' + col.cellClass);
                        }
                        cc.push('">');

                        if (col.checkbox) {
                            cc.push('<input type="checkbox" name="' + field + '" value="' + (value != undefined ? value : '') + '">');
                        } else if (col.expander) {
                            //cc.push('<div style="text-align:center;width:16px;height:16px;">');
                            cc.push('<span class="datagrid-row-expander datagrid-row-expand" style="display:inline-block;width:16px;height:16px;margin:0;cursor:pointer;" />');
                            //cc.push('</div>');
                        } else if (col.formatter) {
                            cc.push(col.formatter(value, rowData, rowIndex));
                        } else {
                            cc.push(value);
                        }

                        cc.push('</div>');
                        cc.push('</td>');
                    }
                }
                return cc.join('');
            },
        });
    }
};

3、用的是easyloader.js加载,代码中使用如下

using(['datagrid'], function () {
                if (easyuifix) easyuifix.innerobject_datagrid();
            });

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值