227

【ASP.NET MVC】jqGrid 增删改查详解 - Alan_beijing

 6 years ago
source link: http://www.cnblogs.com/wangjiming/p/7613160.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

【ASP.NET MVC系列】浅谈jqGrid 在ASP.NET MVC中增删改查

ASP.NET MVC系列文章

【01】浅谈Google Chrome浏览器（理论篇）

【02】浅谈Google Chrome浏览器（操作篇）（上）

【03】浅谈Google Chrome浏览器（操作篇）（下）

【04】浅谈ASP.NET框架   

【05】浅谈ASP.NET MVC运行过程    

【06】浅谈ASP.NET MVC 控制器   

【07】浅谈ASP.NET MVC 路由   

【08】浅谈ASP.NET MVC 视图 

【09】浅谈ASP.NET MVC 视图与控制器传递数据

【10】浅谈jqGrid 在ASP.NET MVC中增删改查     

【11】浅谈ASP.NET 页面之间传值的几种方式

【12】浅谈缓存技术在ASP.NET中的运用       

【13】浅谈NuGet在VS中的运用      

【14】浅谈ASP.NET 程序发布过程           

【15】浅谈数据注解和验证           

【16】浅谈依赖注入

【17】浅谈表单和HTML辅助方法

【18】浅谈基于APS.NET身份验证

【19】浅谈ASP.NET MVC 模型

【20】浅谈ASP.NET MVC 单元测试

【21】浅谈ASP.NET MVC网络安全;

【22】浅谈ASP.NET MVC八大类扩展

【23】再谈ASP.NET MVC Routing

【24】浅谈ASP.NET 高级话题

【25】浅谈大型ASP.NET MVC项目（含DEMO）

【26】下一系列：ASP.NET WebAPI

1066923-20180119111916974-764315611.png

本篇文章主要是关于JqGrid的，主要功能包括使用JqGrid增删查改，导入导出，废话不多说，直接进入正题。

2   Demo相关

2.1   Demo展示

2.2  源码和DB下载

本来国庆上传到github上的，现在github有点问题，因此后期再传到github，有需要源码的，可以在评论区留下自己联系联系方式，我直接传给你。

3  公共模块

3.1 Model实体—EmployeeInfo

View Code

3.2  DBHelper帮助类

View Code

4   数据访问层DAL

4.1  对EmployeeInfo的CRUD

View Code

4.2 简要分析

5   控制器层

5.1 方法

View Code

5.2 分析

 6.1  View  Code

View Code

6.2  分析

6.2.1  初始化数据

(1)图解功能

(2)功能Code

定义table获取区和翻页区

1 <table id="JqGrid-table"></table>
2 <div id="JqGrid-pager"></div>

JqGrid

View Code

6.2.2  JqGrid自带的CRUD

(1)图解功能

(2)功能Code

 //JqGrid自带的CRUD
 $('#JqGrid-table').jqGrid('navGrid', "#JqGrid-pager", {
       search: true, // show search button on the toolbar
       add: true,
       edit: true,
       del: true,
       refresh: true
});

6.2.3 自动检测区：

(1)图解功能

(1)功能Code

 1 //模糊查询
 2    var timer;
 3    $("#search_input").on("keyup", function () {
 4            var self = this;
 5             if (timer) { clearTimeout(timer); }
 6             timer = setTimeout(function () {
 7              //timer = null;
 8              $("#JqGrid-table").jqGrid('filterInput', self.value);
 9            }, 0);
10 });

6.2.4  JqGrid自带导出功能

(1)图解功能

(2)功能Code

$("#btn_export").on("click", function () {
     $("#JqGrid-table").jqGrid("exportToExcel", {
          includeLabels: true,
          includeGroupHeader: true,
          includeFooter: true,
          fileName: "jqGridExport.xlsx",
          maxlength: 40 // maxlength for visible string
        });
 });

6.2.5 自定义CRUD

(1)图解功能

(2)功能Code

View Code

6.2.6 导出

(1)图解功能

(2)功能Code

View Code

Q1:批量导入时，excel版本问题

Q2:批量导入时，input 上传文件路径，需要使用相对路径，而非绝对路劲

8   待解决问题

Q1:统一异常控制

Q2:JqGrid换肤

Q3:压力测试

Q4:友好提示

Q4:其他

首先祝福大家国庆快乐，除此之外，若有任何问题，欢迎指教。

10   参考文献

[01]http://www.trirand.com/blog/?page_id=5

[02]http://blog.mn886.net/jqGrid/

11  服务区

有喜欢的朋友，可以看一下，不喜欢的的朋友，勿喷，谢谢！！

  • 感谢您的阅读，若有不足之处，欢迎指教，共同学习、共同进步。
  • 博主网址：http://www.cnblogs.com/wangjiming/。
  • 极少部分文章利用读书、参考、引用、抄袭、复制和粘贴等多种方式整合而成的，大部分为原创。
  • 如您喜欢，麻烦推荐一下；如您有新想法，欢迎提出，邮箱：[email protected]。
  • 可以转载该博客，但必须著名博客来源。

report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK