关于DataGrid处理后端返回的固定格式数据

本文介绍了如何解决easyui DataGrid在显示数据时遇到的问题,当后端返回的数据格式不符合默认要求(total和rows)时,通过使用loadFilter方法对后端返回的数据进行转换和处理,确保DataGrid能够正确展示5条记录。

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

由于easyui的datagrid处理列表中的数据是固定格式

 {total: 12, rows: Array[5]}

total是总条数,rows是要展示的数据,我这里是要展示5条,然后我后端返回的固定格式是这样的

{
code: 30000,
msg: successs,
data: [{id: xxx, name: xxx, ...}, {...}]
}

这datagrid肯定是展示不了的,这就需要用到loadFilter来处理后端的数据了。代码展示

 $('#logTable').datagrid({
        singleSelect:true,
        pagination:true,
        pageNumber:1,
        url:"/getLogList",
        pageSize:5,
        pageList: [5,10,15,20],
        rowNumbers: false,
        columns:[
            [
                {field:'log_id',title:'log_id',hidden:true},
                {field:'log_name',title:'账户名称',width:100,align:'center'},
                {field:'enter_time',title:'上线时间',width:200,align:'center'},
                {field:'offline_time',title:'下线时间',width:200,align:'center'}
            ]],
        loadFilter:function(data) {
            return loadFilter(data);    //自定义过滤方法
        }
    });
}
//过滤后端传递到前端的值
function loadFilter(data) {
    var jsonArray=data.data;
var result = jsonArray[jsonArray.length-1].total;//后端数据是[{...}..,{total=总条数}]即展示数据加上条数,所以后面循环时要减一
    var rows=[];
    for(var i=0; i< jsonArray.length-1; i++){
        rows.push({
            log_id:jsonArray[i].log_id,
            log_name:jsonArray[i].log_name,
            enter_time:jsonArray[i].enter_time,
            offline_time:jsonArray[i].offline_time
        });
    }
    var value = {
        total:result,
        rows:rows
    };
    return value;
}
这样就可以正常翻页了
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值