datagrid动态生成列

1,首先,写方法将问题类型和派单方式里面的所有的字段内容找到,完成后台方法

 


2,js,使用datagrid方法时,将columns指向一个function

basicReport=$('#basicReport').datagrid({

       ...............

 ....................       

  columns:fetchBasicColumns(),

........................

.............

});

  3,书写function fetchBasicColumns(){  

 var columnsOne = new Array();

 var columnsTwo = new Array();

    $.ajax({

type : "POST",

url : "XXXXXXXXX",

datatype : "json",

async: false,

success : function(data) {

var data = $.parseJSON(data);

 columnsOne.push({title: 'A', field: 'time',rowspan:2});

columnsOne.push({title:"B",colspan:data.queTypeColumns.length});

columnsOne.push({title:"C",colspan:data.sendWayColumns.length});

columnsOne.push({title: 'D', field: 'avgTime',rowspan:2});

columnsOne.push({title: 'E', field: 'countAll',rowspan:2});

$.each(data.queTypeColumns,function(i,item){

columnsTwo.push({"title":item,"field":"queType"+i,rowspan:1,width:50});

});

$.each(data.sendWayColumns,function(i,item){

columnsTwo.push({"title":item,"field":"sendWay"+i,rowspan:1,width:50});

});

}

 });

    return new Array(columnsOne,columnsTwo);

};  

多表头模板写法:[       [{title: 'A', field: 'time',rowspan:2,width:'15%'},

{title:"B",colspan:3,width:'30%'},  

    {title:"C",colspan:3,width:'30%'},

    {title: 'D', field: 'avgTime',rowspan:2,width:'15%'},

    {title: 'E', field: 'countAll',rowspan:2,width:'10%'}],

      

     [{title:"XXXXX",field:"X",rowspan:1,width:50},  

      {title:"XXX",field:"X",rowspan:1,width:50},  

      {title:"XXX",field:"X",rowspan:1,width:100},  

      {title:"XXXXX",field:"x",rowspan:1,width:50},  

      {title:"XXXX",field:"X",rowspan:1,width:50},  

      {title:"xXXX",field:"X",rowspan:1,width:50}]

]

4. 后台书写datagrid访问的方法

    @SuppressWarnings("unchecked")

@RequestMapping(value="/XXXXXXXX")

@ResponseBody

public List<JSONObject> setWeekData(@RequestParam(value="time",required=false) String time){

。。。。。。。。。。。。。。。。。。。。。。

Map<String,Object>basicColumns=reportService.fetchBasicColumns();

List<String> queTypeColumns=(List<String>) basicColumns.get("queTypeColumns");

List<String> sendWayColumns=(List<String>) basicColumns.get("sendWayColumns");

List<JSONObject> result=new ArrayList<>();

List<Map<String, Object>> queType = reportService.findQueType(wd);

List<Map<String, Object>> sendWay = reportService.findSendWay(wd);

List<String> queTypeColumnList=new ArrayList<String>();

List<String> sendWayColumnList=new ArrayList<String>();

for(String queTypeColumn : queTypeColumns){

String queTypeNumber="0";

   for (Map<String, Object> map : queType) {

if(queTypeColumn.equals((String)map.get("typeName"))){

queTypeNumber=(String)map.get("cnt").toString();

}

}

   queTypeColumnList.add(queTypeNumber);

}

for(String sendWayColumn : sendWayColumns){

String sendWayNumber="0";

for (Map<String, Object> map : sendWay) {

if(sendWayColumn.equals((String)map.get("typeName"))){

sendWayNumber=(String)map.get("cnt").toString();

}

}

sendWayColumnList.add(sendWayNumber);

}

Long avgTime = reportService.findAvgTime(wd);

Long countAll = reportService.countAll(wd);

jsonObj.put("avgTime", avgTime!=null?avgTime:0);

jsonObj.put("countAll", countAll!=null?countAll:0);

for(int i=0;i<queTypeColumnList.size();i++){

jsonObj.put("queType"+i, queTypeColumnList.get(i));

}

for(int i=0;i<sendWayColumnList.size();i++){

jsonObj.put("sendWay"+i, sendWayColumnList.get(i));

}

jsonObj.put("time", year+""+week+"");

result.add(jsonObj);

return result;

}

猜你喜欢

转载自blog.csdn.net/cacalili/article/details/79095910