基于我上一篇文章<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文件中。代码片段如下

aaarticlea/png;base64,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" alt="" />

所以展示每个表的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[].ToString().Trim(',').Split(',');
string[] englishname = list[].ToString().Trim(',').Split(',');
for (int i = ; i < chinesname.Length; i++)
{
colnames += "'" + chinesname[i].ToString() + "',";
}
List<Department> list1 = new List<Department>();
for (int j = ; 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 list1
select new
{
index = dept.index,
lable = dept.lable,
name = dept.name,
sortable = false
}),
data = new
{
options = new
{
page = "",
total = "",
records = "",
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
}

至此问题就被完美的解决了。

asp.net mvc jqgrid 同一个页面查询不同的表,jqgrid显示不同表的表头和数据并且分页的更多相关文章

  1. 【问题】Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数

    [问题]Asp.net MVC 的cshtml页面中调用JS方法传递字符串变量参数. [解决]直接对变量加引号,如: <button onclick="deleteProduct('@ ...

  2. 七天学会ASP.NET MVC (五)——Layout页面使用和用户角色管理

    系列文章 七天学会ASP.NET MVC (一)——深入理解ASP.NET MVC 七天学会ASP.NET MVC (二)——ASP.NET MVC 数据传递 七天学会ASP.NET MVC (三)— ...

  3. 学习笔记:Asp.Net MVC更新部分页面

    Asp.Net MVC 更新部分页面 设想我们有一篇文章下面的提交评论时如何只刷新评论内容部分, 方法一,利用ajax通过js代码实现. 方法二,利用Ajax.BeginForm()+部分视图实现. ...

  4. 返璞归真 asp.net mvc (1) - 添加、查询、更新和删除的 Demo

    原文:返璞归真 asp.net mvc (1) - 添加.查询.更新和删除的 Demo [索引页] [源码下载] 返璞归真 asp.net mvc (1) - 添加.查询.更新和删除的 Demo 作者 ...

  5. 七天学会ASP.NET MVC (五)——Layout页面使用和用户角色管理 【转】

    http://www.cnblogs.com/powertoolsteam/p/MVC_five.html 系列文章 七天学会ASP.NET MVC (一)——深入理解ASP.NET MVC 七天学会 ...

  6. ASP.NET MVC+EF框架+EasyUI实现权限管理系列(18)-过滤器的使用和批量删除数据(伪删除和直接删除)

    原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(18)-过滤器的使用和批量删除数据(伪删除和直接删除) ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   ...

  7. 小试ASP.NET MVC——一个邀请页面的实现

    上篇博客我们大体介绍了ASP.NET MVC以及如何去新建项目,这篇博客我们讲点干货.小试ASP.NET MVC,我们来写一个简单的邀请WEB. 先来建立一个Models,叫GuestResponse ...

  8. ASP.NET MVC 自定义错误页面心得

    自定义错误页面的目的,就是为了能让程序在出现错误/异常的时候,能够有较好的显示体验. 所以,首先要先了解,我们可以在哪里捕获异常. 当程序发生错误的时候,我们可以在两个地方捕获: Global里面的A ...

  9. ASP.NET MVC之"重定向/页面跳转"(关键词RedirectToAction,Redirect)

    MVC5 API(官方) 1.RedirectToRouteResult RedirectToAction(string actionName); RedirectToRouteResult Redi ...

随机推荐

  1. tomcat install on Linux

    1)下载apache-tomcat-6.0.10.tar.gz 2)#tar -zxvf apache-tomcat-6.0.10.tar.gz ://解压 3)#cp -R apache-tomca ...

  2. JavaScript效果之选项卡

    拼了命学习js,想把学到的Javascript效果,可以记在博客里,在记录过程中,加深理解. gogogo,第一个效果,选项卡. 一.选项卡效果的实现思路 选项卡效果的应用很广泛,几乎所有的网站都会用 ...

  3. C#中npoi操作Excel[版本2.0.1读写2003、2007格式]

    下载npoi2.0.1dll文件:http://download.csdn.net/detail/pukuimin1226/5851747 public static void test1()     ...

  4. java多线程之消费者生产者模式 (转)

    /*@author shijin * 生产者与消费者模型中,要保证以下几点: * 1 同一时间内只能有一个生产者生产 生产方法加锁sychronized * 2 同一时间内只能有一个消费者消费 消费方 ...

  5. Linux下设置最大文件打开数nofile及nr_open、file-max

    在开发运维的时候我们常常会遇到类似“Socket/File: Can’t open so many files”,“无法打开更多进程”,或是coredump过大等问题,这些都可以设置资源限制来解决.今 ...

  6. sublime text 3.0使用

    # 快捷键    //未完待续 ctrl+p : 文件快速搜索 Ctrl+D : 选词 (按住-继续选择下个相同的字符串) ctrl+L : 选择整行(按住-继续选择下行,即按住ctrl不放按一次L则 ...

  7. Windows2012中安装域控(DC) + SQL Server 2014 + TFS 2015

    安装域控(DC) 修改计算机名 修改固定IP 添加角色 选择“Role-based or feature-based installation” 选择本机 选择“Active Directory Do ...

  8. c# 格式化百分比

    代码示例: <%#Eval("total").ToString() == "0" ? "00.00%" : (Convert.ToDe ...

  9. Android多屏幕适配

    转载:http://mikewang.blog.51cto.com/3826268/865304 问题: 测试时,发现应用在不同的显示器上显示效果不同(部分文本不能显示完全),自然想到屏幕适配的问题. ...

  10. 隐藏元素的宽高无法通过原生js获取的问题

    1.起源:移动app项目中,页面加载时需要加载国家下拉列表,将隐藏的透明浮层和一个显示加载过程中的框 显示出来,隐藏的透明浮层设置宽高都是100%即可,而这个加载提示框需要先得出它的宽高,然后再根据页 ...