問題：使用Grid時，如果出現列標題與復選框錯位
使用定義樣式
.ext-ie7 .x-menu-item-icon,
.ext-ie6 .x-menu-item-icon {left: -24px;}
.ext-ie8 .x-menu-item-icon,
.ext-ie7 .x-menu-item-icon,
.ext-ie6 .x-menu-item-icon {left: -24px;}
解決
使用grid的遮罩提示時，一定要設表格的height和width。
enableColumnMove和enableColumnResize為false表示禁用拖放列和改變列寬度功能。
默認情況下一次可以選一行或多行。
stripeRows:true顯示為斑馬線。
問題：自主決定每列的寬度
1.手動指定
cm(columnmudule)支持給每列設置寬度,如果不指定則默認的寬度為100px.
var cm=new Ext.grid.columnModel({
{header:'列頭',dataIndex:'數據源索',width:寬度},....});
2.自動填充
var gird=new Ext.grid.GridPanel({
renderTo:'grid',
store:store,
cm:cm,
viewConfig:{forceFit:true}});
會按照設置的寬度之間的比例進行顯示，而不是按照設置的寬度。
3.指定自動填充剩余空間的列
也可以指定一列來完成該操作，但該操作要求該列必須定義時指定id值。
var cm=new Ext.grid.columnModel({
{header:'列頭',dataIndex:'數據源索',width:寬度,id:'id標識屬性'},....});
接下來設定
Ext.grid.GridPanel({
renderTo:'grid',
store:store,
cm:cm,
autoExpandColumn:'id列標識'});
問題：讓列支持排序
在建立列模型時指定storable:true
問題：中文排序
1.為Ext.data.Store設置一個storeInfo:{field:'列名',direction:'ASC|DESC'}屬性。
2.重寫Ext.data.Store的applySort函數
Ext.data.Store.prototype.applySort = function() {
if (this.sortInfo && !this.remoteSort) {
var s = this.sortInfo, f = s.field;
var st = this.fields.get(f).sortType;
var fn = function(r1, r2) {
var v1 = st(r1.data[f]), v2 = st(r2.data[f]);
if (typeof(v1) == "string") {
return v1.localeCompare(v2);
}
return v1 > v2 ? 1 : (v1 < v2 ? -1 : 0);
};
this.data.sort(s.direction, fn);
if(this.snapshot && this.snapshot != this.data) {
this.snapshot.sort(s.direction, fn);
}
}
};
該函數可以加在ext-all.js文件的未尾。或者放在html頁面的最上面，保證在EXT初始化之后，實際代碼調用之前執行。
問題：顯示日期類型數據列
1.在store的reader屬性中增加type和dataFormat兩個屬性
{name: 'date',type:'date',dateFormat:'Y-j-n H:i:s'}
注意格式化字符串必須要與實際日期的內容相對應。
如日期為2009-5-2 12:30:58 則格式化字符串為'Y-j-n H:i:s'
如日期為2009-05-02 12:30:58 則格式化字符串為'Y-m-d H:i:s'
詳細字符串的含義見ext api doc之Date類
以保證能夠讀取到正確的日期值。
2.在ColumnModel中新加配置
{header: '日期',dataIndex: 'date',type:'date',renderer:Ext.util.Format.dateRenderer('Y年j月n日')}
其中renderer的格式字符串表示顯示的格式是什么。
問題：如何在單元格時顯示紅色的字或圖片，按鈕等
在ColumnModule的相應列的屬性中添加renderer:渲染函數
如:
var cm=new Ext.grid.ColumnModel([
{head:'列頭',dataIndex:'數據源索',renderer:渲染函數}]);
渲染函數：
function 函數名(value){
if(value==值）｛
return html+css代碼;
}
else
{
return 其它的html+css;
}
}
問題：如何設置表格的表頭右鍵提示為漢字內容
Ext.grid.GridPanel可以看作控制器，Ext.data.Store可以看作模型，Ext.grid.GridView可以看作視圖.在構建Ext.grid.GridPanel實例時添加viewConfig屬性
var gid=new Ext.grid.GridPanel(
{renderTo:'grid',
store:store,
cm:cm,
viewConfig:{
columnsText:'顯示的列',
scrollOffset:30,
sortAscText:'升序',
sortDescText:'降序'
//forceFit:true
}
});
問題：用grid實現分頁顯示
１.為Grid添加分頁工具條
在GridPanel中進行設置
var grid = new Ext.grid.GridPanel({
renderTo: 'grid',
autoHeight: true,
store: store,
cm: cm,
bbar: new Ext.PagingToolbar({
pageSize:3,
store: store,
displayInfo: true,
displayMsg: '顯示第 {0} 條到 {1} 條記錄，一共 {2} 條',
emptyMsg: "沒有記錄"
})
});
store.load();
在使用分頁工具條之后，store.load()必須發生在構造GridPanel之后.而且數據源不能使用Ext.data.SimpleStore.Grid每次都會顯示數據源中所有的數據.因此數據一定要先在后臺分好.
如果要在Grid的頭部顯示分頁工具條，可以將bbar改為tbar。
２.后臺分頁
后臺jsp的做法：
①取得開始頁號與頁大小
String start = request.getParameter("start");
String limit = request.getParameter("limit");
②訪問數據庫取得數據
③將數據輸出為json字符串
格式為：{totalProperty:總記錄數,root:[｛.....｝，｛.....｝，....]),其中root數組存放當前頁的數據.
前臺頁面的做法：
①修改Store
var store = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:jsp的url'}),
reader: new Ext.data.JsonReader({
totalProperty: 'totalProperty',
root: 'root'
}, [
{name: 'id'},
{name: 'name'},
{name: 'descn'}
])
});
②向服務器傳參
store.load({params:{start:0,limit:10}});
Grid每次都會顯示全部在root中的數據，而不論totalProperty的值是多少，所以分頁時root數組中的數據由后臺jsp控制。
3.前臺分頁
EXT中的Grid是把得到的數據一次性顯示在表格里，并沒有直接為我們提供內存分頁的功能，但是在Ext的examples/locale/PapingMemoryProxy.js，它可以從本地數據讀取數據同，并實現內存分頁。
步驟如下：
①將PagingMemoryProxy.js導入html
②把以前的MemroryProxy換成PagingMemoryProxy
③調用store.load({params:{start:0,limit:3}});顯示最開始的3條記錄。
4.后臺排序
在默認的情況下，Grid只能對當前頁的數據進行排序，如果對所有的數據排序，則需要將排序信息提交到后臺，由后臺將信息組裝到SQL里，然后再由后臺將處理好的數據返回給前臺。
var store = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'09_01.jsp'}),
reader: new Ext.data.JsonReader({
totalProperty: 'totalProperty',
root: 'root'
}, [
{name: 'id'},
{name: 'name'},
{name: 'descn'}
]),
remoteSort: true
});
其中remoteSort: true表示允許后臺排序，這樣在排序時就會有變化，不會立即顯示出排序的結果，而是向后臺提交兩個參數，分別是sort和dir，表示要排序的字段與升序或降序。
jsp則進行相應的處理
String start = request.getParameter("start");
String limit = request.getParameter("limit");
String sort = request.getParameter("sort");
String dir = request.getParameter("dir");
再進行數據庫分頁，并返回json格式的分頁數據。
本文來自CSDN博客，轉載請標明出處：http://blog.csdn.net/hfy211/archive/2009/06/29/4306357.aspx