使用easyUI的datagrid來做行列都不固定的交互矩陣

實現思路：

1. 首先將列頭信息都查詢出來，用js去構造出完成的cloumns屬性；

/**
 * 生成grid列信息
 * @param data 數據
 * @returns
 */
var appDataDic= {};
function generateColumns(data){
	var col = [];
	var columnNames = [];
	var dataResult = [];
	
	for (var i = 0; i < data.length; i++) {
		var attr = {};
		var app ={};
		var appCode = data[i].applicationCode;
		var appName = data[i].applicationName;
		attr.field = appCode;
		attr.title = appName;
		attr.align = 'left';
		attr.sortable = 'false';
		attr.formatter = function(value, rowData, rowIndex) {
			return formatRow(value, rowData)
		};
		dataResult.push(attr);
		app.code = appCode;
		app.name = appName;
		appDataDic[appCode] = appName;
		columnNames.push(app);
	}
	
	col.push(dataResult);
	$obj_ = $("#demoId");
	$obj_.datagrid({
		fitColumns : true,
		autoRowHeight : true,
		nowrap : true,
		border : false,
		showFooter : false,
		frozenColumns:[[
		    {field:'appCode'}
		]],
		columns : col
	});
	
	return columnNames;
}


/**
 * 格式化顯示的值
 * @param value 值
 * @param rowData 行記錄信息
 * @returns
 */
function formatRow(value, rowData) {
	var opt = "";
	var val = value.split(",");
	if (!val[1]) {
		return;
	} else {
		var codes = val[0].split("_");
		opt += "<a href='#' onClick='showDetail(\"" + codes[0] + "\",\""
				+ codes[1] + "\")'>" + val[1] + "</a>";
	}
	return opt;
}

2. 再請求行數據，使用datagrid的loadData將數據填充到grid中去

/**
 * 填充grid數據
 * @param columnNames  列名
 * @returns
 */
function initData(columnNames) {
	$.ajax({
		url : '****/****/***',
		type : 'POST',
		timeout : 60000,
		success : function(data) {
			var dataResult = formatData(columnNames, data);
			$obj_.datagrid('loadData', dataResult);
		}
	});
}


/**
 * 構造數據
 * @param col 列名
 * @returns
 */
function formatData(col, map){
	var data = [];
	for (var i = 0; i < columns.length; i++) {
        var attr = {};
        attr.appCode = columns[i]["name"];
        for (var j = 0; j < columns.length; j++) {
        	var key = columns[j]["code"] + "_" + columns[i]["code"];
            var value = map[key];
            if(value){
                attr[columns[j]["code"]] = key + "," + value;
            }else{
                attr[columns[j]["code"]] = key + ", ";
            }
        }
        data.push(attr);
    }

    var result = {};
    result.total = data.length;
    result.rows = data;
    return result;
}