【JQGRID DOCUMENTATION】.学习笔记.1.安装jqGrid
前面介绍了怎么使用其MVC方式,很好用。不过,觉得还是只使用前段比较好。
1.1 如何安装
到http://www.trirand.com/blog/?page_id=6 下载。
需要按以下顺序,
链接jQuery UI的的CSS文件,然后jqGrid的CSS文件。
然后引用jQuery脚本文件,i18n脚本文件,jqGrid脚本文件。
2 了解他是如何工作的
理解jqGrid是如何工作的,会帮助你掌握插件的全部功能。要理解的第一件事情,是列表数据的两个方面:
- 客户端表现
- 服务端操作
JqGrid是使得web浏览器grid容易操作的列表数据组件。它使用Ajax,调用取回信息,并使用jqGrid Column Model(colModel)构建列表数据的表现。
此外,jqGrid帮助你,发送任何数据变化,或附加服务端的数据库,一个被称作服务端操作的处理,或SSM。
SSM是指服务器处理实际的变化,更新到数据库,而不是通过用户的浏览器。SSM不是web页面中可见的东西。服务端数据变更使用PHP,或其他任何公共编程语言。
一个jqGrid包含以下四个部分:
- Caption layer 包含grid的公共信息
- Header layer 包含列的信息:label,width
- Body layer 从服务器请求的数据,在column model中显示关联的设置
- Navigation layer 包含被请求数据的附加信息,和请求一小片信息的动作。Navigation layer不仅仅能显示在grid的bottom,可以在页面的任何地方。它上面也能加按钮和链接,如editing,deleting,adding,searching。
Grid最小的数据表现,是Header layer和Body layer。
为了自由和灵活性,和总是更好的印象,jqGrid依赖CSS来显示。
3 第一个Grid
为了jqGrid,我们需要遵循下面三个事情
- 一个有样本数据的数据库
- 一个显示data的HTML页面
- 一个服务端组件,扮演web页面和数据库之间的接口
服务端代码:
Property | Description |
url | 告诉我们去哪取得数据。代表性的是服务端从数据库取得相应。 |
datatype | 告诉jgGrid,返回信息的类型,让jgGrid构建它。 |
mtype | 告诉我们如何做Ajax请求:Get或POST。 |
colNames | 一组列名。会显示在grid的head上。 |
colModel | 描述列模型的数组。这是gird最重要的一部分。常用的 name:列名,不必和数据库中一样。 index:传递给服务器用来分类排序的名字。我们也可以传递列数。一般地,这是数据库中的名字,用来服务端排序。 width:列的宽度,单位是像素。 align:列的对齐方式。 sortable:指定列中的数据可以被排序。如果false,点击header没有效果。 |
pager | 定义一个pager bar来导航记录。它可以放在任何地方。 |
rowNum | 设置grid中显示的行数。这个参数会传递给URL,从服务器取回数据 |
rowList | 一个数组,构建一个select box元素,可以改变可视行数。在运行期间改变这个值,会替换rowNum参数 |
sortname | 设置初始化的排序列。可以是一个名字或数字。这个参数会附加到URL上。 |
viewrecords | 定义是否我们在pager bar上显示查询的总记录数 |
caption | 设置grid的主题。如果这个参数没有设置,则不显示。 |
服务端返回的XML数据格式中:
…
<row id = 'unique_rowid'>
…
…
</rows>
Tag | Description |
rows | grid的跟标签 |
page | 被请求的页数 |
total | 查询的总页数 |
records | 查询的总条数 |
row | grid中特别的行 |
cell | 实际的数据。CDATA可以被使用。这种方式可以添加图片,链接和check boxes。 |
每行的cell tags个数,必须等于定义在colModel中的cells个数。row tags中的id属性,如果这个属性被忽略了,jgGrid会有两种方式处理这个独一无二的id:如果colModel中该属性设置了key,jqGrid会指派列的值到这行的id。不然,jqGrid会基于row的顺序设定id。
如果使用一个与内容无关的primary key来标识数据行,那么grid的可视单元格不包含这个值。
【JQGRID DOCUMENTATION】.学习笔记.1.安装jqGrid的更多相关文章
- CentOS学习笔记--Tomcat安装
Tomcat安装 通常情况下我们要配置Tomcat是很容易的一件事情,但是如果您要架设多用户多服务的Java虚拟主机就不那么容易了.其中最大的一个问题就是Tomcat执行权限.普通方式配置的Tomca ...
- OracleDesigner学习笔记1――安装篇
OracleDesigner学习笔记1――安装篇 QQ:King MSN:qiutianwh@msn.com Email:qqking@gmail.com 一. 前言 Oracle是当 ...
- CUBRID学习笔记 2 安装教程
下载地址 http://www.cubrid.org/?mid=downloads&item=any&os=detect&cubrid=9.3.0 选择适合你的服务器版本 l ...
- nodejs学习笔记<一>安装及环境搭建
零零散散学了几天nodejs,进度一直停滞不前,今天沉下心来好好看了下nodejs的介绍和代码.自己也试着玩了下,算是有点入门了. 这里来做个学习笔记. ——————————————————————— ...
- docker学习笔记1 -- 安装和配置
技术资料 docker中文官网:http://www.docker.org.cn/ 中文入门课程:http://www.docker.org.cn/book/docker.html docker学习笔 ...
- Nginx 学习笔记之安装篇
在windows下安装Nginx其实非常简单,只需如下几个步骤: 1. 在Nginx官网下载相应版本的安装程序,上面有最新版.稳定版等各种版本,正式运营的项目建议下载最新的稳定版 2.将下载后的压缩包 ...
- 学习笔记:安装swig+用SWIG封装C++为Python模块+SWIG使用说明
这段时间一直在摸索swing,用它来封装C++代码来生成python脚步语言.并总结了swing从安装到配置再到代码封装编译生成动态库的整个过程,下面这篇文章都是我在实际的运用中的一些经验总结,分享给 ...
- Docker学习笔记之--安装mssql(Sql Server)并使用Navicat连接测试(环境:centos7)
前一节演示如何使用Nginx反向代理 .net Core项目容器,地址:Docker学习笔记之-部署.Net Core 3.1项目到Docker容器,并使用Nginx反向代理(CentOS7)(二) ...
- TP6学习笔记一:安装与基本配置
1 说明与概述 1.1 说明 以下内容大部分来源于TP6完全开发手册,以手册为主附上个人理解,仅作学习使用. 1.2 概述 第一篇学习笔记,主要记录TP6的基础,包括TP6简介,安装,Hello Wo ...
随机推荐
- Android RecycleView + CardView 控件简析
今天使用了V7包加入的RecycleView 和 CardView,写篇简析. 先上效果图: 原理图: 这是RecycleView的工作原理: 1.LayoutManager用来处理RecycleVi ...
- java中 set,list,array(集合与数组)相互转换
public static Object[] List2Array(List<Object> oList) { Object[] oArray = oList.toArray(new ...
- 8、JavaScript深入浅出——数据类型
一.六种数据类型 Javascript是弱类型. 五种原始类型和一种对象类型: number String boolean null undefined Object 二.隐式转换 +与-的运算举例: ...
- cocos2dx 3.x(多个按钮button执行同一事件的区分)
// // ATTGamePoker.hpp // MalaGame // // Created by work on 2016/10/18. // // #ifndef ATTGamePoker_h ...
- Chrome模拟手机浏览网页
用Chrome模拟手机浏览网页,只需要编辑一个命令就可以实现 C:\Users\xxx\AppData\Local\Google\Chrome\Application\chrome.exe --use ...
- C# WebApi传参之Get请求-AJAX
最近悟出来一个道理,在这儿分享给大家:学历代表你的过去,能力代表你的现在,学习代表你的将来. 十年河东十年河西,莫欺少年穷. 学无止境,精益求精 在介绍本篇博客之前,先来温故下AJax的请求, ...
- php 调用 java 接口
php 需要开启 curl模块 /** HTTP 请求函数封装*/function http_request_cloudzone($url, $data){ //var_dump($url." ...
- Java基础之线程——管理线程同步方法(BankOperation2)
控制台程序. 当两个或多个线程共享同一资源时,例如文件或内存块,就需要采取措施,确保其中的一个线程不会修改另一个线程正在使用的资源.当其中的一个线程更新文件中的某个记录,同时另一个线程正在检索这个记录 ...
- 学习OpenCV——Kalman滤波
背景: 卡尔曼滤波是一种高效率的递归滤波器(自回归滤波器), 它能够从一系列的不完全及包含噪声的测量中,估计动态系统的状态.卡尔曼滤波的一个典型实例是从一组有限的,包含噪声的,对物体位置的观察序列(可 ...
- mysql 常见的几个错误问题
Mysql常见的几个错误问题及解决方法: 1.问题: mysql DNS反解:skip-name-resolve 错误日志有类似警告: 点击(此处)折叠或打开 120119 16:26:04 [War ...