Response和Request常用方法以及mmgrid插件的学习
Response和Request
Response和Request容器是一一对应的，他是web容器在用户每次请求服务端的时候，创建的一对容器对象，Response容器是服务端返还给客户机的一个响应内容对象容器，比如说：响应头，响应行，实体数据等信息，而Request容器对象是，代表用户请求服务端的的一个容器对象，比如客户机的请求头，请求行，以及携带的参数信息等。所以说Request容器对象和Response容器对象是一一对应的，他们两的生命周期也是一样的，就是在一次用户请求中。Request除了有一个容器对象的角色，他还有一个角色就是Request域，Request域的范围小，他只是一次用户的请求内，即用户发送一个请求的时候，Request创建，当用户关闭这次请求的时候Request就会消亡的。
- request.getSchema()可以返回当前页面使用的协议，http 或是 https;
- request.getServerName()可以返回当前页面所在的服务器的名字;
- request.getServerPort()可以返回当前页面所在的服务器使用的端口,就是80;
- request.getContextPath()可以返回当前页面所在的应用的名字;
其他Request具体方法详见https://blog.csdn.net/qq_29464887/article/details/79030766
其他Response具体方法详见https://blog.csdn.net/qq_29464887/article/details/79031547
mmGrid 是 jQuery 实现对表格的样式库的插件。支持包括排序、Ajax、宽度锁定、列隐藏、锁定、nowrap、多选、选择和分页等功能，还可以配合Bootstrap使用，效果更加好看华丽。
mmGrid简介
这是一个基于jQuery的表格部件。它提供了几个基本的功能，可以用于面积有限却要显示较多数据的页面。 它的样式表很简单，修改起来非常容易，你可以很快的给它更换一个样式融入到你的页面中。
如果你喜欢简洁点的东西，不想在工程里加入太多依赖的文件，那你可以尝试一下它。顺便说一句，它也支持IE6这样的老古董。
使用方法
1、下载mmGrid
你可以访问mmGrid的Github地址（https://github.com/miemiedev/mmGrid），从右侧下载按钮得到mmGrid的源文件
2、引入插件文件
mmGrid有两个样式文件，第一个为主要的显示样式，第二个为分页样式，如果你的表格不需要分页，可以不用引入mmPaginator.css文件。
<link rel="stylesheet" href="../src/mmGrid.css">
<link rel="stylesheet" href="../src/mmPaginator.css">mmGrid基于jQquery插件，所以在引入mmGrid.js文件之前，必须先引入jQuery库，如果使用了JSON数据格式，还需要引入json2.js文件，同样的mmPaginator.js文件不是必须要引入的文件
<script src="js/jquery.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/json2.js"></script>
<script src="../src/mmGrid.js"></script>
<script src="../src/mmPaginator.js"></script>至此mmGrid的安装就算是完成了，接下来我们将介绍如何使用这个插件
3、配置插件
mmGrid支持两种数据加载方式：本地对象数据和远程AJAX数据。
本地对象数据
本地数据对象可直接新建一个JSON数组，然后在调用mmGrid的时候传入这个数据即可，数据格式参见官方示例
$('#table2-1').mmGrid({
cols: cols,
items: items
});
ID为table2-1的jQuery对象为我们的一个表格，里面可以不用编写任何代码，所有数据都是由我们items对象提供
以客户端数据为数据源。参数items，类型可以是对象或数组。如果数据源为对象，则使用root选项标记对象内的数组字段为数据源。
远程对象数据
远程对象数据需要配置url和method参数，数据格式参见官方提供的示例
$('#table2-2').mmGrid({
cols: cols,
url: 'data/stockQuote.json',
method: 'get'
});AJAX数据为数据源。参数url为请求地址，返回数据为json格式，可以是对象或数组。如果返回数据为对象，则使用root选项标记对象内的数组字段为数据源。
mmGrid特点
支持排序
排序参数为sortName和sortStatus。 如果初始化时设置排序列，则直接显示排序后数据。 排序方式分为客户端排序与AJAX服务器端排序，设置参数为remoteSort。 排序方式与数据源关系不大，但如果数据源为本地数据，设置remoteSort为true无效。 如果排序字段为数字类型需要将列选项添加type:'number'属性。远程排序时，列模型可以设置sortName来指定远程排序的字段名称，如不设置则为name中的值。
支持列状态
锁定列宽：锁定列宽选项为lockWidth:true。列宽被锁定后则不可调整，当表选项fullWidthRows设为true列的宽度也不参与计算。
隐藏列：隐藏列选项为hidden: true。当光标移至标题时标题最右侧会显示向下按钮，单击此按钮则可打开选项板来调整隐藏和显示的列，调整完毕后单击选项板右下方的向上按钮来关闭选项板。
锁定列显示状态：锁定列显示状态选项为lockDisplay: true。锁定列显示状态后，在选项板中列选项会被值为灰色，此列则不可调整显示状态。
内容折行
表选项nowrap设置单元格内容超出单元格长度时是否折行显示。
自适应列宽
当表选项fullWidthRows设置为true时，表格在第一次数据加载时计算列宽，将其充满整个表格。锁定列宽的列不参与计算。如果所有显示的列宽总和大于表格宽度这个参数将不起作用。
选择行
表选项multiSelect设置表格是否可多选，默认为单选。可通过表操作$('#table').mmGrid('selected')获取选择的行对象。 当光标单击单元格时触发cellSelected事件，该事件可在表选项设置。
选框列
表选项checkCol可以在表格前插入选框列。checkCol选项可以和multiSelect搭配使用。
索引列
表选项indexCol可以在表格前插入索引列。如果索引数字过大超出单元格可使用indexColWidth调整宽度。
显示全部行
表选项height设置为’auto‘时，表格显示全部行，并不显示垂直滚动条。
分页
这里的分页示例借助了分页器，开发者可以根据自己的需求选择使用其他分页器。
表头分组
列模型可嵌套一个cols选项用来将表头分组，目前只支持两层。
部分实例如下：
function queryData(load){
var cols = [
{ title:'开始时间', name:'startDate' ,width:80, sortable: true, align:'center' },
{ title:'结束时间', name:'endDate' ,width:80, sortable: true, align:'center' },];
var mmg = $('#mmg').mmGrid({
height: 'auto'
, cols: cols
, url: path+'/？？？？/'
, fullWidthRows: true
, multiSelect: false
, checkCol: false
, nowrap:true
, autoLoad:true
, plugins: [
$('#pg').mmPaginator({page:1,limit:2,totalCountName:'totalCount'})
]
, params: function(){
//如果这里有验证，在验证失败时返回false则不执行AJAX查询。
return {page:1 , limit:2 };
}
});
mmg.on('loadSuccess', function(e, data){ }返回的表单对象grid可以进行以下表操作
| 名称 | 参数 | 描述 |
|---|---|---|
| load | {} | [] | 如果配置过AJAX选项，则这里是AJAX参数，如果传入对象数组，则为加载本地数据。 |
| selectedRows | 无参数 | 返回选择行数据的数组。 |
| selectedRowsIndex | 无参数 | 返回选择行索引的数组。 |
| select | int | function(item, index){ return true; } | 'all' | 选中参数条件的行。int: 选中索引行; function: 过滤函数, item参数为行数据, index参数为行索引; 'all': 选中所有行。 |
| deselect | int | function(item, index){ return true; } | 'all' | 取消选中参数条件的行。int: 取消选择索引行; function: 过滤函数, item参数为行数据, index参数为行索引; 'all': 取消选中所有行。 |
| rows | 无参数 | 返回所有行的数据数组。 |
| row | int | 返回指定索引行的数据。 |
| rowsLength | 无参数 | 返回行数。 |
| addRow | item,index | 添加数据到索引行，index为可选。如item为对象数组则一次添加多行。 |
| updateRow | item,index | 更新数据到索引行，index为必选。一次只能更新一行。 |
| removeRow | index | 移除索引行。如index为索引数组则一次移除多行。如果index为undefined则移除所有行。 |
| 名称 | 可选值 | 描述 |
|---|---|---|
| width | 'auto', 500, '500px' | 表格宽度。参数为'auto'和以'%'结尾,表格可在调整窗口尺寸时根据父元素调整尺寸。 |
| height | '280px', 500, '500px' | 表格高度。如果以'%'结尾,表格可在调整窗口尺寸时根据父元素调整尺寸。如果设置为'auto'，表格显示全部行，不显示垂直滚动条 |
| url | false, string | AJAX请求数据的地址。 |
| params | {}, object, function(){ return {}; } | AJAX请求的参数。可以是普通对象或函数。 函数返回一个参数对象，每次调用AJAX时调用。 |
| method | 'post', 'get' | AJAX提交方式。 |
| ache | false, true | AJAX缓存。 |
| items | [], Array | 数据使用本地对象数组。 |
| root | '', string | 指定json对象的数组字段为数据。 |
| nowrap | false, true | 表格显示的数据超出列宽时是否换行。 |
| multiSelect | false, true | 数据使用本地对象数组。 |
| fullWidthRows | false, true | true:表格第一次加载数据时列伸展，自动充满表格。 |
| checkCol | false, true | 表格显示checkbox |
| indexCol | false, true | 表格显示索引列 |
| indexColWidth | 30 | 表格索引列宽度 |
| loadingText | '正在载入...', string | 数据载入时的提示文字。 |
| noDataText | '没有数据', string | 没有数据时的提示文字。 |
| cols | [], Array | 数据模型。 |
| sortName | '', string | 排序的字段名。字段名的值为列模型设置的sortName或name中的值。 |
| sortStatus | 'asc', string | 排序方向。 |
| remoteSort | false, true | 是否使用服务器端排序。当值为true时，sortName和sortStatus会作为参数放入AJAX请求中。 |
| autoLoad | true, false | 是否表格准备好时加载数据。 |
| showBackboard | true, false | 是否显示选项背板。 |
| plugins | [] | 表格插件，插件必须实现 init($mmGrid)和params()方法，参考mmPaginator |
二.列选项
| 名称 | 可选值 | 描述 |
|---|---|---|
| title | string | 标题文字。 |
| titleHtml | string | 标题文字的HTML代码。 |
| width | int | 标题宽度像素值，默认为100。 |
| name | string | 字段名。 |
| align | 'left', 'center', 'right' | 文字位置。 |
| hidden | false, true | 是否隐藏列。 |
| lockDisplay | false, true | 是否锁定列的显示状态。 |
| lockWidth | false, true | 是否锁定列宽。被锁定的列不参与fitCols选项的计算。 |
| sortable | false, true | 是否可排序。 |
| sortName | string | 当sortable为true，远程排序发出的字段名，如果这个字段名为空，则发出的字段名为name的值 |
| renderer | function(val,item,rowIndex){ return val;} | 显示规则。参数: val 值, item 对象, rowIndex 行索引; 返回值: 可以是纯文本或html。 |
| type | 'number' | 字段类型。只用于数字的本地排序。 |
| cols | [], Array | 数据模型。用于表头分组，目前只支持两层。 |
三.表操作
| 名称 | 参数 | 描述 |
|---|---|---|
| load | {} | [] | 如果配置过AJAX选项，则这里是AJAX参数，如果传入对象数组，则为加载本地数据。 |
| selectedRows | 无参数 | 返回选择行数据的数组。 |
| selectedRowsIndex | 无参数 | 返回选择行索引的数组。 |
| select | int | function(item, index){ return true; } | 'all' | 选中参数条件的行。int: 选中索引行; function: 过滤函数, item参数为行数据, index参数为行索引; 'all': 选中所有行。 |
| deselect | int | function(item, index){ return true; } | 'all' | 取消选中参数条件的行。int: 取消选择索引行; function: 过滤函数, item参数为行数据, index参数为行索引; 'all': 取消选中所有行。 |
| rows | 无参数 | 返回所有行的数据数组。 |
| row | int | 返回指定索引行的数据。 |
| rowsLength | 无参数 | 返回行数。 |
| addRow | item,index | 添加数据到索引行，index为可选。如item为对象数组则一次添加多行。 |
| updateRow | item,index | 更新数据到索引行，index为必选。一次只能更新一行。 |
| removeRow | index | 移除索引行。如index为索引数组则一次移除多行。如果index为undefined则移除所有行。 |
四.事件
| 名称 | 参数 | 描述 |
|---|---|---|
| loadSuccess | function(e, data){} | 数据加载成功后执行。 |
| loadError | function(e, data){} | 数据加载失败后执行。 |
| cellSelected | function(e, item, rowIndex, colIndex){} | 表格中的单元格被选择后执行。item：被选择单元格所在行对应的数据对象；rowIndex：行索引；colIndex：列索引。 |
| rowInserted | function(e, item, index){} | 表格中的数据被插入后执行。item：插入的数据对象；index：行索引。 |
| rowUpdated | function(e, oldItem, newItem, index){} | 表格中的数据被更新后执行。oldItem：更新前的数据对象；newItem：更新后的数据对象；index：行索引。 |
| rowRemoved | function(e, item, index){} | 表格中的数据被删除后执行。oldItem：被删除行的数据对象；index：被删除前的行索引。 |
3,注意点：
1，root :'items',items对象是必须存在的，否则表格在没有数据时不会提示“没有数据”，并且默认的水平和垂直滚动条都会没有。对象存在，但对象里的内容为空时显示没有数据，对象不存在时就会出现上述情况。
推荐：jquery之插件mmgrid的使用方法（较详细）介绍每个属性的对应功能设计
http://blog.sina.com.cn/s/blog_a94593820102vzw2.html
转自：http://www.uedsc.com/mmgrid.html （后附项目实例）