1.如下圖效果是當(dāng)選擇不同的日期范圍時(shí)datagrid則會加載出對應(yīng)的列數(shù)
2.首先是后臺組裝數(shù)據(jù),我采用的是循環(huán)并拼接DataTable數(shù)據(jù),如下代碼
//循環(huán)添加datagrid所需的表頭數(shù)據(jù) for (int i = 0; i < table.Columns.Count; i++) { columns.AppendFormat("{{field:'{0}',title:'{1}',align:'center',width:{2}}},", table.Columns[i].ColumnName, table.Columns[i].ColumnName, 41); } //刪除最有一個(gè)filed多餘的","號 if (table.Columns.Count > 0) { columns.Remove(columns.Length - 1, 1); } columns.Append("]]"); //組裝工令各站排程達(dá)成狀況表頭和數(shù)據(jù) Dictionary<string, object> objDic = new Dictionary<string, object>(); objDic.Add("columns", columns.ToString()); //datagrid表頭 objDic.Add("rows", table); //datagrid表數(shù)據(jù) //轉(zhuǎn)換為Json格式 return Common.JsonHelper.ToJson(objDic)
3.取得瀏覽器所返回的組裝后的JSON格式數(shù)據(jù),如下
{"columns":"[[{field:'Item',title:'項(xiàng)目',align:'center',width:120},{field:'SumMonth',title:'3月份累計(jì)',align:'center',width:70},{field:'03/01',title:'03/01',align:'center',width:41},{field:'03/02',title:'03/02',align:'center',width:41},{field:'03/03',title:'03/03',align:'center',width:41},{field:'03/04',title:'03/04',align:'center',width:41},{field:'03/05',title:'03/05',align:'center',width:41},{field:'03/06',title:'03/06',align:'center',width:41},{field:'03/07',title:'03/07',align:'center',width:41},{field:'03/08',title:'03/08',align:'center',width:41},{field:'03/09',title:'03/09',align:'center',width:41},{field:'03/10',title:'03/10',align:'center',width:41},{field:'03/11',title:'03/11',align:'center',width:41},{field:'03/12',title:'03/12',align:'center',width:41},{field:'03/13',title:'03/13',align:'center',width:41}]]","rows":[{"SerailNum":1,"Item":"累計(jì)各LOT耗用工時(shí)之合(H)","SumMonth":142.00,"03/01":null,"03/02":null,"03/03":null,"03/04":50.00,"03/05":null,"03/06":7.00,"03/07":42.00,"03/08":null,"03/09":null,"03/10":17.00,"03/11":null,"03/12":26.00,"03/13":null},{"SerailNum":2,"Item":"產(chǎn)出LOT批","SumMonth":13.00,"03/01":0.00,"03/02":0.00,"03/03":0.00,"03/04":2.00,"03/05":0.00,"03/06":4.00,"03/07":2.00,"03/08":0.00,"03/09":0.00,"03/10":1.00,"03/11":0.00,"03/12":4.00,"03/13":0.00},{"SerailNum":3,"Item":"平均實(shí)際CT","SumMonth":10.92,"03/01":null,"03/02":null,"03/03":null,"03/04":25.00,"03/05":null,"03/06":1.75,"03/07":21.00,"03/08":null,"03/09":null,"03/10":17.00,"03/11":null,"03/12":6.50,"03/13":null}]}
4.瀏覽器端解析數(shù)據(jù),并綁定datagrid
//綁定工令各站排程達(dá)成狀況 $("#dg_PDL_RealCT").datagrid({ width: 'auto', //寬度 height: 'auto', //高度 singleSelect: true, //允許選中一行 striped: true, //設(shè)置為true將交替顯示行背景。 rownumbers: true, //顯示行號 title: "站別實(shí)際CT-日報(bào)", //標(biāo)題 iconCls: "icon-save", //圖表 collapsible: true, //隱藏按鈕 method: "post", //post請求 showFooter: true, loadMsg: "數(shù)據(jù)加載中...", //載入信息時(shí)提示內(nèi)容 onLoadError: function () { $.messager.alert('溫馨提示', "加載數(shù)據(jù)失敗!!!"); }, view: myview, emptyMsg: '沒有檢索到相關(guān)數(shù)據(jù)!' }); //end datagrid //綁定工令各站排程達(dá)成狀況表頭 $.post("/PI/PDL_RealCT", { "BDate": $("#BDate").datebox('getValue'), "EDate": $("#EDate").datebox('getValue'), "
|
新聞熱點(diǎn)
疑難解答
圖片精選