基于我上一篇文章<a href="http://www.cnblogs.com/alasai/p/4765756.html">asp.net mvc excel导入</a>中不同的部门上传不同的excel文件类型,当在同一个页面查询时怎么办呢。
解决方案:根据传过来的表名和时间参数一次性把数据全部加载到table中,其中表头要我们一个个去定,主体的顺序我们也要和表头一样,加载到前台再用表格分页控件来分页,我这里大概有100多个excel文件类型,他们的列名都不要,想想这样的做法不且实际。
有没有其他的解决方案呢,看了很多的jqgrid示例,他们的表头(colNames)和内容(colModel)都是首先定死的。这里我想到一个解决方案就是把colNames和colModel都做成活的,这样不就可以完美解决上面的问题了吗,
想法总是好的,但做起来不是一帆风顺的,但前提是你得有这种想法才行。
想法和思路:
1.把jqgrid的colNames和colModel都做成活的,但是每个表的colNames都不一样,而且他们的顺序必须一致才行,怎么办呢,在<a href="http://www.cnblogs.com/alasai/p/4765756.html">asp.net mvc excel导入</a>这篇文章中我上传文件成功之后会把他们的colNames和colModel都保存在以他们表名命名的txt文件中。代码片段如下
所以展示每个表的colNames和colModel就不成问题
后台c#代码如下:
[HttpPost]public ActionResult GetTestData(string department, string tablename, string StartTime, string EndTime){Stopwatch watch = CommonHelper.TimerStart();string sql5 = "SELECT * FROM " + department + "_" + tablename + " where 1=1 and enabled='1' ";if (!string.IsNullOrEmpty(StartTime)){sql5 += " and convert(varchar(10),addtime,120)>='" + StartTime + "' ";}if (!string.IsNullOrEmpty(EndTime)){sql5 += " and convert(varchar(10),addtime,120)<='" + EndTime + "' ";}DataTable ListData = DataFactory.Database().FindTableBySql(sql5);this.dirCSV = Server.MapPath("~/Content/uploads/");StreamReader sr = new StreamReader(this.dirCSV + "\\" + department + "_" + tablename + ".txt");String line;List<string> list = new List<string>();while ((line = sr.ReadLine()) != null){list.Add(line.ToString());}string colnames = "";string[] chinesname = list[0].ToString().Trim(',').Split(',');string[] englishname = list[1].ToString().Trim(',').Split(',');for (int i = 0; i < chinesname.Length; i++){colnames += "'" + chinesname[i].ToString() + "',";}List<Department> list1 = new List<Department>();for (int j = 0; j < englishname.Length; j++){list1.Add(new Department { index = englishname[j].ToString().ToLower(), lable = chinesname[j].ToString(), name = englishname[j].ToString().ToLower(), sortable = "false" });}var result = new{Json = new{colNames = chinesname,colModels = (from dept in list1select new{index = dept.index,lable = dept.lable,name = dept.name,sortable = false}),data = new{options = new{page = "1",total = "1",records = "1",costtime = CommonHelper.TimerEnd(watch),rows = ListData}}}};return Content(result.ToJson());}
那么前台改如何解析上面生成的json呢。
jquery代码如下
$.ajax({url: "@Url.Content("/DataSwitch/GetTestData")?department=" + $("#seldepartment").val() + "&tablename=" + $("#ExcelFileId").val() + "&sjs=" + new Date().getTime() + "&StartTime=" + $("#StartTime").val() + "&EndTime=" + $("#EndTime").val(),type: 'POST',cache: false,data: {},success: function (result) {result = eval('('+result+')');var colModels = result.Json.colModels;var colNames = result.Json.colNames;var data = result.Json.data.options;$("#gridTable").jqGrid({datatype: 'jsonstring',datastr: data,colNames: colNames,colModel: colModels,jsonReader: {root: 'rows',repeatitems: false},gridview: true,pager: $('#gridPager'),height: $(window).height() - 111,autowidth: true,rowNum: 15,rowList: [15, 30, 50, 100],viewrecords: true,rownumbers: true,shrinkToFit: false})},error: function (result) {}}); //end ajax
现在查询不同的表可以显示在jqgrid中显示不同的表内容了,但是这里又出现了一个问题(这个问题你是在百度上很难找得到解决方案的)
问题就是只能显示第一次选择的表内容,而且分页也没有效果,这个问题困扰了我三个小时,最后在jqgrid群里问了一下,有人说是加载之后,加载数据的html没有了。这时我就试试了再加载不同表格之前我重新构造一下html。
$grid = $("<table id='gridTable'></table><div id='gridPager'></div>");$('#grid_List').empty().html($grid);
这时这段简短而神奇的代码解决了上面遇到的问题。
完整的jquery代码如下
//加载表格function GetGrid() {var eid = $("#ExcelFileId").val();if (eid == ""){tipDialog("请先选择文件类型", 3,0);return false;}$grid = $("<table id='gridTable'></table><div id='gridPager'></div>");$('#grid_List').empty().html($grid);$.ajax({url: "@Url.Content("/DataSwitch/GetTestData")?department=" + $("#seldepartment").val() + "&tablename=" + $("#ExcelFileId").val() + "&sjs=" + new Date().getTime() + "&StartTime=" + $("#StartTime").val() + "&EndTime=" + $("#EndTime").val(),type: 'POST',cache: false,data: {},success: function (result) {result = eval('('+result+')');var colModels = result.Json.colModels;var colNames = result.Json.colNames;var data = result.Json.data.options;$("#gridTable").jqGrid({datatype: 'jsonstring',datastr: data,colNames: colNames,colModel: colModels,jsonReader: {root: 'rows',repeatitems: false},gridview: true,pager: $('#gridPager'),height: $(window).height() - 111,autowidth: true,rowNum: 15,rowList: [15, 30, 50, 100],viewrecords: true,rownumbers: true,shrinkToFit: false})},error: function (result) {}}); //end ajax}
至此问题就被完美的解决了。