easyui datagrid组件应用

最新推荐文章于 2023-01-06 15:46:06 发布

原创最新推荐文章于 2023-01-06 15:46:06 发布 · 840 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #easyui

js 专栏收录该内容

6 篇文章

订阅专栏

本文详细介绍了如何解决Datagrid组件在无数据时无法正确显示全部列的问题，并提供了相应的解决代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

$("#grid").datagrid({
url:'getGridData.do',
columns:[[
{field:'username',title:'姓名',width:200,align:'center'},
{field:'age',title:'年龄',width:200,align:'center'},
{field:'sfzh',title:'身份证号',width:200,align:'center'},
{field:'DH',title:'电话',width:150,align:'center'}
]],
fit:true,
rownumbers:true,
singleSelect:true,
onLoadSuccess:function(data){
if(data.total==0){
var dc = $(this).data('datagrid').dc;
var header2Row = dc.header2.find('tr.datagrid-header-row');
dc.body2.find('table').append(header2Row.clone().css({"visibility":"hidden"}));
}
}
});
$("#grid").datagrid('loadData',[]);

组件存在的一些问题：

1)datagrid组件无数据时不能显示全部列。

解决办法：

$('#dg3').datagrid({
            onLoadSuccess:function(data){
                if(data.total==0){
                    var dc = $(this).data('datagrid').dc;
                    var header2Row = dc.header2.find('tr.datagrid-header-row');
                    dc.body2.find('table').append(header2Row.clone().css({"visibility":"hidden"}));
                }
            }
        });