jqgrid实现前台动态加载列

最近开发时遇到一个前台动态加载列的问题，于是就总结了下和大家分享；

思路：和正常的jqgrid开发差不多，就是对于列的话要通过后台去动态组装然后再返回前台，而不是传统的在前台js写死。下面我们来看看我是如何实现的吧

js代码

var hrJqGridCommonSettings ={

        mtype : 'POST',
        datatype : "json",
        rowNum : 20,
        rowList : [ 10, 20, 50, 100, 200,500 ],
        rowId : "uuid",
        pager : "#pager",
        recordpos : "right",
        viewrecords : true,
        multiselect : true,
        multiboxonly : true,
        autowidth : true,
        shrinkToFit:false,
        height : 450,
        scrollOffset : 0,
        jsonReader : {
            root : "data",
            total : "totalPages",
            page : "currentPage",
            records : "totalCount",
            repeatitems : false
        }    

} ;

//声明全局变量（显示的列和列名）

var nameString=[];
var modelString=[];

//该方法和ajax请求一样，只是本什么有做封装可以直接请求service ,返回一个map

JDS.call({
        async:false,
        service : "hrAttDailyReportDataService.jsonModelAndNames",
        success : function(result) {
            bean = result.data;
            nameString=eval("("+bean.colNames+")");//此处记得用eval()行数将string转为array
            modelString=eval("("+bean.colModel+")");            
            }
    });

    $("#list").jqGrid($.extend(hrJqGridCommonSettings, {
        url : ctx + '/hr/attAnnual_grid/grid?serviceName=hrAttDailyReportDataService&serviceMethod=queryByDailyReportData',    
        colNames : nameString,
        colModel :modelString,
        sortable : true, // 是否可排序
        //autowidth: true,  
        shrinkToFit:false,
        jsonReader : {
            root : "data",
            total : "totalPages",
            page : "currentPage",
            records : "totalCount",
            repeatitems : false
        }

    }));

java 代码

//该方法动态查询想要展示的列

public Map<String, String> jsonModelAndNames() {
        List<Map<String, Object>> list = queryDict();
        Map<String, String> map = new HashMap<String, String>();
        String name = null;
        String code = null;
        if (list != null) {
            for (Map<String, Object> m : list) {
                for (Entry<String, Object> eSet : m.entrySet()) {
                    if (name == null) {
                        name = "'" + eSet.getValue().toString() + "',";
                        code = " {name :'" + eSet.getKey() + "',index:'" + eSet.getKey() + "',width : '80'}, ";
                    } else {
                        name = name + "'" + eSet.getValue().toString() + "',";
                        code = code + " {name :'" + eSet.getKey() + "',index:'" + eSet.getKey() + "',width : '80'}, ";
                    }
                }

            }
        }
        String colNames = "[" + name + "']";
        String colModel = "[" + code+”]";
        map.put("colNames", colNames);
        map.put("colModel", colModel);
        return map;
    }

//将数据字典维护的列作为页面将要显示的列

    public List<Map<String, Object>> queryDict() {
        String sql = "select name,code FROM cd_data_dict d where d.parent_uuid in (select uuid FROM cd_data_dict where code in ('VACATION_CATEGORY')) ";
        Query query = this.dao.getSession().createSQLQuery(sql);
        List<Object> list = query.list();
        List<Map<String, Object>> list1 = new ArrayList<Map<String, Object>>();
        for (Object o : list) {
            Map<String, Object> map = new HashMap<String, Object>();
            Object[] ob = (Object[]) o;
            map.put(ob[1].toString(), ob[0]);
            list1.add(map);
        }
        return list1;
    }

//该方法为页面查询的结果

    @Override
    public List<QueryItem> queryByDailyReportData(Map<String, Object> queryParams, PagingInfo pagingInfo) {
        List<QueryItem> list = nativeDao.namedQuery("getAttDailyReportAllData", queryParams, QueryItem.class,
                pagingInfo);
        if (list != null && list.size() > 0) {
            List<Map<String, Object>> maps = queryDict();
            for (QueryItem q : list) {
                String uuid = q.getString("employeeUuid");
                for (Map<String, Object> map : maps) {
                    for (Entry<String, Object> e : map.entrySet()) {
                        int hours = vacationHours(e.getKey(), uuid);//将数据字典查出来的列作为参数查出对应的数据
                        q.put(e.getKey(), hours);//将数据字典维护的编码作为字段名称加入集合中
                    }
                }
            }
        }
        return list;
    }

//将数据字典查出来的列作为参数查出对应的数据

public int vacationHours(String code, String empUuid) {
        String sql = "select sum(r.leave_hours)  from hr_att_daily_report_vacations r, hr_att_daily_report_data d where r.daily_report_uuid = d.uuid   and r.category_key = '"
                + code + "' and r.employee_uuid='" + empUuid + "' ";
        Query query = this.dao.getSession().createSQLQuery(sql);
        int hours = query.uniqueResult() != null && query.uniqueResult() != "" ? Integer.valueOf(query.uniqueResult()
                .toString()) : 0;
        return hours;
    }