jquery easyui中datagrid 中的动态接受后台传的数据

摘要: 在开发中遇到一个问题,就是从后台传过的数据,字段数量和数据是不固定的,所以要对datagrid 方法进行改进

1.前台返回数据

controller 方法要加上@ResponseBody

这里的 list 是数据集合 ele 是字段集合

2.js接受数据

$.ajax({
            type: "post",
            url: $("#baseUrl").val()+"/query/queryTab",
            data: JSON.stringify(data),
            success : function(data) {
                 //加载数据
                if(eval(data) == ""){
                }else{
                    //调列表显示
                    list(eval(data.list),data.ele)
                }
            },
            error : function() {
                alert('查询名称异常');
            }
        });

3.dg方法中

//查询结果列表
function list(data,ele){
    $('#dg').datagrid({    
        //title:"详细信息",
        rownumbers:true,
        singleSelect:true,
        pagination:true,
        pageSize:20,
        loadMsg:"数据加载中...",
        width:'auto',
        height:'auto',
        left:"100px",
        toolbar:"#tb",
        columns:getColumns(ele), //列名
        loadFilter:pagerFilter  //分页                        
    }).datagrid('loadData',  getDataAll(data,ele));
}
function fixWidthTable(percent){  
     return getWidth(0.8) * percent;  
 }

function getWidth(percent){  
    return $(window).width() * percent;  
} 
//数据
function getDataAll(data,ele){    
    var rows = [];
    for(var i=0; i<data.length; i++){
        var ff="{" ;
        for(var n=0; n<ele.length; n++){

                        if(n==ele.length-1){
                var name =ele[n]
                var val = eval("data[i]."+name)
                ff = ff+"""+ name+""";
                ff=ff+":"
                ff = ff+val
            }else{
                var name =ele[n]
                var val = eval("data[i]."+name)
                ff = ff+"""+ name+""";
                ff=ff+":"
                ff = ff+val
                ff = ff+","
            }
        }
        ff =ff +"}";
        var oj = JSON.parse(ff)
        rows.push(
                oj
        );
    }
    return rows;
}

//列名
function getColumns(ele){
    var s = "";  
    s = "[["; 
    var width = 1/ele.length 
    for(var i=0; i<ele.length; i++){

                if(i==ele.length-1){
            s=s+"{field:'"+ele[i]+"',title:'"+ele[i]+"',width:fixWidthTable("+width+"),halign: 'center',align:'center',formatter: "
             +   "function(value,row,index){"
             +   "      return '<span >'+ value+'</span>';"
             +"  } }";
        }else{
            s=s+"{field:'"+ele[i]+"',title:'"+ele[i]+"',width:fixWidthTable("+width+"),halign: 'center',align:'center',formatter: "
            +   "function(value,row,index){"
            +   "      return '<span >'+ value+'</span>';"
            +"  } },";
        }
    }
    s = s + "]]";  
    return eval(s);
}

//分页
function pagerFilter(data){

     if (typeof data.length == 'number' && typeof data.splice == 'function'){    
         data = {
             total: data.length,
             rows: data
         }
     }
     var dg = $(this);
     var opts = dg.datagrid('options');
     var pager = dg.datagrid('getPager');
     pager.pagination({
         pageList: [20,40,60],//[10,20,50,100]选择每页显示的记录数的下拉框的值。
         onRefresh:function(){search()},
         onSelectPage:function(pageNum, pageSize){
             opts.pageNumber = pageNum;
             opts.pageSize = pageSize;
             pager.pagination('refresh',{
                 pageNumber:pageNum,
                 pageSize:pageSize
             });
             dg.datagrid('loadData',data);
         }
     });
     if (!data.originalRows){
         data.originalRows = (data.rows);
     }
     var start = (opts.pageNumber-1)*parseInt(opts.pageSize);
     var end = start + parseInt(opts.pageSize);
     data.rows = (data.originalRows.slice(start, end));
     return data;
}
 

写的不好 各位提意见