二. 常用的属性：
1.sortable:true,//sortable设为排序
2.enableColumnMove:false,//设置是否拖放列
3.enableColumnResize:false,//设置是否改变列大小
4.stripeRows:true, //每列是否是斑马线分开
5.loadMask:true, //加载时有加载的图标
6.autoExpandColumn:'要自定义宽度的id' //可以制定列的宽度自动伸展。只能制定一列的id,所以要在前面指定的列先写好id
7.viewConfig:{
forceFit:true //每列自动充满Grid
}
8.sortInfo: {field: "name", direction: "ASC"}//在原来的前提下，加此行：field代表排序列名，direction代表排序方式(ASC是升序，DESC是降序)
9.renderer: Ext.util.Format.dateRenderer('Y-m-d')
//这里需要添加的renderer属性的值设置为Ext.util.Format.dateRenderer。这是为我们提供的格式
10.type:'date',dateFormat: 'Y-m-dTH:i:s'//type是reader解析时把这一列作为日期类型处理，dateFormat是把得到的字符串转换成相应的日期格式
10-2.在写数据的时候要：'1970-01-15T02:58:04',//添加一列时间的数据，格式要和下面设置的dateFormat一样
11.new Ext.grid.RowNumberer(), //自动显示行号
12.<input type="button" id="remove" value="删除第二行" />//新建按钮，id="remove"
Ext.get('remove').on('click', function() {//获得id，执行点击事件
store.remove(store.getAt(1));//store.getAt(a)是找到要找的那行的内容,a从0开始(及第一行就是0)，该代码表示删除改行的信息
grid.view.refresh();//清除一行信息，最左边显示的行的id重新编号
});
13.var sm = newExt.grid.CheckboxSelectionModel();//新建复选框的对象，使用的时候直接写 'sm'
14.Ext.grid.RowSelectionModel({singleSelect:true})//设置行是否可以按shift多选（true为不可以）
15.只选一行执行
grid.on('click', function() {
var selections = grid.getSelectionModel().getSelections();
for (var i = 0; i < selections.length; i++) {
var record = selections[i];
Ext.Msg.alert('提示', record.get("id") + "," + record.get("name") + "," + record.get("descn"));
}
}); //点击一行，就输出该行的信息
16.表格视图
var grid = new Ext.grid.GridPanel({
//设置各种监听器可看做控制器
height: 80,
450,
renderTo: 'grid',
store: new Ext.data.Store({
autoLoad: true,
proxy: new Ext.data.MemoryProxy(data),
reader: new Ext.data.ArrayReader({}, meta)
}),
columns: meta
});//表格定义太小的话，自己默认产生滚动条
grid.getView().scrollToTop();//滚动条滚动到最上面
grid.getView().focusCell(0, 0);//焦点定位在第一行的第一列
17.自己定义，改变GridView的初始参数
viewConfig: {
columnsText: '显示的列',
scrollOffset: 30,//表示表格右侧为滚动条预留的宽度
sortAscText: '升序',
sortDescText: '升序',
forceFit: true //表格自动延展每列的长度，使内容充满整个表格
}
18.Grid添加分页工具条
var grid = new Ext.grid.GridPanel({
renderTo: 'grid',
autoHeight: true,
store: store,
cm: cm,
bbar: new Ext.PagingToolbar({
pageSize: 10, //每页显示信息的条数
store: store,
displayInfo: true, //是否显示数据信息
displayMsg: '显示第 {0} 条到 {1} 条记录，一共 {2} 条', //在displayInfo有效的前提上，{0}{1}{2}中的数据会自己替换掉
emptyMsg: "没有记录" //没有数据时显示的信息
})
});
store.load();
19.通过后台获取分页数据
var store = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'09_02_01.jsp'}), //直接通过Http访问数据
reader: new Ext.data.JsonReader({
totalProperty: 'totalProperty', //对应JSP代码中返回的totalProperty，就是数据的总数
root: 'root' //root对应的JSP代码中的返回的root，也就是一个包含返回数据的数组
}, [
{name: 'id'},
{name: 'name'},
{name: 'descn'}
])
});
以及要改变store.load();为：
store.load({params:{start:0,limit:10}}); //初始化时通过传参数去获得希望得到的那部分数据，start指示从第几条数据开始显示，limit指从start开始一共几条数据