码迷,mamicode.com
首页 > 其他好文 > 详细

easyui datagrid 去掉外边框及行与行之间的横线

时间:2015-12-16 17:08:38      阅读:12225      评论:0      收藏:0      [点我收藏+]

标签:

这是以前写的一个项目中写的东西,为了让datagrid样式好看,所有做的这个处理:

今天同事又问到于是记录下来

 

$(‘#id‘).datagrid({
                width: ‘99%‘,
                height: 150,
                fit: false,
                nowrap: true,
                url: ‘url地址‘,
                singleSelect: true,
                columns: [
                    [
                        {
                            field: ‘TaskName‘, title: ‘标题‘, width: ‘100%‘, formatter: function (v, rd, i) {
                                if (v != undefined) {
                                    return ‘<img src="../Images/roundpoint.png"></img> <a href="#" onclick= ReportDetails(\‘‘ + rd.MatTypeInt +
                                            ‘\‘,\‘‘ + rd.PeriodNo + ‘\‘,\‘‘ + rd.TaskId + ‘\‘,\‘‘ + v + ‘\‘,\‘‘ + rd.MatType + ‘\‘)  class="href-noneline-blacknofont" >‘ + v + ‘,‘ + ‘<span class="red-font">‘ + rd.MatType + ‘</span>总数‘ +
                                            ‘<span class="red-font">‘ + rd.PriceCount + ‘</span>条‘;
                                }
                            }
                        }
                    ]
                ], onLoadSuccess: function (data) {
                    var panel = $(this).datagrid(‘getPanel‘);
                    var tr = panel.find(‘div.datagrid-body tr‘);
                    tr.each(function () {
                        var td = $(this).children(‘td‘);
                        td.css({
                            "border-width": "0"
                        });
                        ;
                    });
                }
            });

  

关键是:

onLoadSuccess: function (data) {
  var panel = $(this).datagrid(‘getPanel‘);
  var tr = panel.find(‘div.datagrid-body tr‘);
  tr.each(function () {
    var td = $(this).children(‘td‘);
    td.css({
      "border-width": "0"
    });
});

 

下面是去外边框线:

#idDiv .datagrid-header {
position: absolute;
visibility: hidden;
}

#idDiv .datagrid-body {
overflow: hidden;
}

 

easyui datagrid 去掉外边框及行与行之间的横线

标签:

原文地址:http://www.cnblogs.com/xiaoruilin/p/5051465.html

(2)
(5)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!