Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引
因为内容比较多,所以每篇讲解一些内容,最后会放出全部代码,可以参考。操作中总会遇到各式各样的问题,个人对部分问题的研究在最后一篇 问题研究 里。欢迎大家探讨学习。
代码都经过个人测试,但仍可能有各种未考虑到问题,欢迎提出。
精通可能夸张了些,但估计能解决使用过程中遇到的大部分问题。
这一篇为 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.问题研究
目录
2.JQGrid简介
3.安装
1.说明
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/#!
项目新建一个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 的使用 - 从入门到精通 开篇及索引的更多相关文章
- Web jquery表格组件 JQGrid 的使用 - 11.问题研究
系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...
- Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数、ColModel API、事件及方法
系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...
- Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮
系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...
- Web jquery表格组件 JQGrid 的使用 - 6.准备工作 & Hello JQGrid
系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...
- Web jquery表格组件 JQGrid 的使用 - 7.查询数据、编辑数据、删除数据
系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...
- Web jquery表格组件 JQGrid 的使用 - 8.Pager、新增数据、查询、刷新、查看数据
系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...
- Web jquery表格组件 JQGrid 的使用 - 全部代码
系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...
- 扩展HT for Web之HTML5表格组件的Renderer和Editor
在HT for Web提供了一下几种常用的Editor,分别是: slider:拉条 color picker:颜色选择器 enum:枚举类型 boolean:真假编辑器 string:普通的文本编辑 ...
- 第二百二十八节,jQuery EasyUI,TreeGrid(树形表格)组件
jQuery EasyUI,TreeGrid(树形表格)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 TreeGrid(树形表格)组件的使 ...
随机推荐
- 纯Swift编写的仿“随遇”应用源码
纯Swift编写的仿“随遇”App概述 此项目是为了巩固Swift掌握而编写的,素材均来自“随遇”官方App 用Storyboard+Xib+Autolayout的方式来实现UI部分 由于项目不复杂, ...
- Linux-学习前言
本随笔会持续,不定期更新.我有上网找与Linux相关的博客,发现很多人只写了几篇就没更新了,没有坚持下来!希望我能keep on. 最近一个月是考试月,可能更新会比较少.
- iOS系列 基础篇 06 标签和按钮 (Label & Button)
iOS系列 基础篇 06 标签和按钮 (Label & Button) 目录: 标签控件 按钮控件 小结 标签和按钮是两个常用的控件,下面咱们逐一学习. 1. 标签控件 使用Single Vi ...
- Oracle数据库11g各版本介绍及功能比较
.标准版和企 业版.所有这些版本都使用相同的通用代码库构建,这意味着企业的数据库管理软件可以轻松地从规模较小的单一处理器服务器扩展到多处理器服务器集 群,而无需更改一行代码.Oracle数据库11g企 ...
- redis-cli中那些或许我们还不知道的一些实用小功能
玩过redis的朋友都知道,redis中有一个叫做redis-cli的小工具,我们可以利用它在test和develop环境下进行高效的模拟测试,然而在现实环境中, 我们只知道直接键入redis-cli ...
- python-函数
函数是组织好的,可重复使用的,用来实现单一,或相关联功能的代码段. 函数能提高应用的模块性,和代码的重复利用率.你已经知道Python提供了许多内建函数,比如print().但你也可以自己创建函数,这 ...
- QWhatsThis的用法
QWhatsThis,为任何widget提供简单的描述,回答"What's This?"这个问题. 示例:(在MainWindow下运行) 定义全局变量 QAction *newA ...
- BZOJ3527[ZJOI]力
无题面神题 原题意: 求所有的Ei=Fi/qi. 题解: qi被除掉了,则原式中的qj可以忽略. 用a[i]表示q[i],用b[j-i]来表示±1/((j-i)^2)(j>i时为正,j<i ...
- Python 【第十一章】 Django模版
1.直接传值 urls.py """mysite URL Configuration The `urlpatterns` list routes URLs to view ...
- [LeetCode] Maximum Product of Word Lengths 单词长度的最大积
Given a string array words, find the maximum value of length(word[i]) * length(word[j]) where the tw ...