因为内容比较多,所以每篇讲解一些内容,最后会放出全部代码,可以参考。操作中总会遇到各式各样的问题,个人对部分问题的研究在最后一篇 问题研究 里。欢迎大家探讨学习。

代码都经过个人测试,但仍可能有各种未考虑到问题,欢迎提出。

精通可能夸张了些,但估计能解决使用过程中遇到的大部分问题。

这一篇为 JQGrid 简单介绍及系列文章索引。

系列索引

Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引

Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数、ColModel API、事件及方法

Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮

Web jquery表格组件 JQGrid 的使用 - 6.准备工作 & Hello JQGrid

Web jquery表格组件 JQGrid 的使用 - 7.查询数据、编辑数据、删除数据

Web jquery表格组件 JQGrid 的使用 - 8.Pager、新增数据、查询、刷新、查看数据

Web jquery表格组件 JQGrid 的使用 - 全部代码

Web jquery表格组件 JQGrid 的使用 - 11.问题研究

JQGrid导出Excel文件

目录

1.说明

2.JQGrid简介

3.安装

1.说明

最近在使用JQGRID,所以进行了一些研究,这个系列博文就是研究成果。以代码为主,说明为辅,请在调试中理解,再多的文字描述比不上几行代码的实现。
 

2.JQGrid简介

JQGrid是一个在jquery基础上做的一个表格控件,以ajax的方式和服务器端通信。

JQGrid Demo 是一个在线的演示项目。在这里,可以知道jqgrid可以做什么事情。

使用场景:

数据多且杂时,如果想要给表格数据的显示增加方便的查询/删选功能。

JqGrid免费,开源,使用方便,是一个不错的选择。

JqGrid的一些说明

·         外观时髦,功能齐全

·         JS控件,用来显示和操作表格数据

·         使用AJAX方式

·         可以被集成到任何服务器端技术,例如ASP, JavaServelets, JSP, PHP 等等.

·         由Trirand公司Tony Tomov开发.

·         和ASP.NET集成非常简单

3.安装

新建一个ASP.NET Web 应用程序,选择web form方式即可。新建一个web页面JQGrid.aspx,设为起始页。

因为jqGrid依赖于jQuery ,所以要下载并引入。从下面网址下载最新的或使用已有的即可。

http://jqueryui.com/download/#!

http://jquery.com/download/

项目新建一个JQGrid文件夹,此文件夹下只存储js和css相关文件。实际项目当然不会这么用,此处仅为示例。

添加jQuery文件。

<script src="JQGrid/jquery-1.11.1.min.js"></script>

<link href="JQGrid/jquery-ui-1.11.1.custom/jquery-ui.css" rel="stylesheet" />

这样jQuery的东西就准备好了。

下面再开始逐个添加我们JqGrid文件。

从这里下载吧 https://github.com/tonytomov/jqGrid/tree/master

<link href="JQGrid/ui.jqgrid.css" rel="stylesheet" />

<script src="JQGrid/grid.locale-cn.js"></script>

<script src="JQGrid/jquery.jqGrid.js"></script>

注意JqGrid文件引用必须在jQuery引用的下方。

效果图:

参考及致谢

http://www.cnblogs.com/cobble19/archive/2013/02/05/2892894.html

http://www.trirand.com/jqgridwiki/doku.php?id=start

http://www.trirand.com/blog/jqgrid/jqgrid.html

http://www.codeproject.com/Articles/609442/Using-JqGrid-in-ASP-NET

http://www.cnblogs.com/miro/p/jqGrid.html

http://blog.csdn.net/feiying008/article/details/38036729

												

Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引的更多相关文章

  1. Web jquery表格组件 JQGrid 的使用 - 11.问题研究

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  2. Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数、ColModel API、事件及方法

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  3. Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  4. Web jquery表格组件 JQGrid 的使用 - 6.准备工作 & Hello JQGrid

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  5. Web jquery表格组件 JQGrid 的使用 - 7.查询数据、编辑数据、删除数据

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  6. Web jquery表格组件 JQGrid 的使用 - 8.Pager、新增数据、查询、刷新、查看数据

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  7. Web jquery表格组件 JQGrid 的使用 - 全部代码

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  8. 扩展HT for Web之HTML5表格组件的Renderer和Editor

    在HT for Web提供了一下几种常用的Editor,分别是: slider:拉条 color picker:颜色选择器 enum:枚举类型 boolean:真假编辑器 string:普通的文本编辑 ...

  9. 第二百二十八节,jQuery EasyUI,TreeGrid(树形表格)组件

    jQuery EasyUI,TreeGrid(树形表格)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 TreeGrid(树形表格)组件的使 ...

随机推荐

  1. WinSetupFromUSB - 制作多系统U盘安装All-In-One的利器

    单U盘玩多个操作系统,这下有福了! 官网最新的下载地址:http://www.winsetupfromusb.com/files/download-info/winsetupfromusb-1-7-e ...

  2. zookeeper事务

    zookeeper事物操作,其实只是其multi操作的简单封装: public List<OpResult> multi(Iterable<Op> ops) 基本操作:new ...

  3. 使用InstallAnywhere工具打包Java_Web程序

      一.准备工作 1.    下载InstallAnywhere,并安装: 2.    下载解压版jdk1.7(示例为jdk1.7.0_75): 3.    下载解压版tomcat7.0以上版本(示例 ...

  4. python-基本数据类型

    /int整数/ 如: 18.73.84 每一个整数都具备如下功能: class int(object): """ int(x=0) -> int or long i ...

  5. 用ajax查询天气

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <script src ...

  6. CentOS 7.0系统安装配置步骤详解

    CentOS 7.0系统是一个很新的版本哦,很多朋友都不知道CentOS 7.0系统是怎么去安装配置的哦,因为centos7.0与以前版本是有很大的改进哦. 说明: 截止目前CentOS 7.x最新版 ...

  7. mybatis: 利用多数据源实现分库存储

    之前写过一篇mybatis 使用经验小结 提到过多数据源的处理方式,虽然简单但是姿势不太优雅,今天介绍一些更美观的办法: spring中有一个AbstractRoutingDataSource的抽象类 ...

  8. Node.js起步 -- (1)

    先来简单介绍nodeJS 我们知道JavaScript是运行在浏览器中的,浏览器为它提供了一个上下文(context),从而让JavaScript得以解析执行. nodeJS其实可以这么理解,它是另外 ...

  9. [LeetCode] Elimination Game 淘汰游戏

    There is a list of sorted integers from 1 to n. Starting from left to right, remove the first number ...

  10. [干货]Chloe官网及基于NFine的后台源码毫无保留开放

    扯淡 经过不少日夜的赶工,Chloe 的官网于上周正式上线.上篇博客中LZ说过要将官网以及后台源码都会开放出来,为了尽快兑现我说过的话,趁周末,我稍微整理了一下项目的源码,就今儿毫无保留的开放给大家, ...