var sm = new Ext.grid.CheckboxSelectionModel();
var cm = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(),
sm,
{header:'編號',dataIndex:'id',sortable:true},
{header:'性別',dataIndex:'sex',sortable:true ,renderer:renderSex},
{header:'名稱',dataIndex:'name'},
{header:'描述',dataIndex:'descn',renderer:renderDescn}
]);
var data = [
['1','male','name1','descn1'],
['2','female','name2','descn2'],
['3','male','name3','descn3'],
['4','female','name4','descn4'],
['5','male','name5','descn5']
];
var ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'http://192.168.0.219/ext-2.1/examples/helloworld/grid.php'}),
reader: new Ext.data.JsonReader({
totalProperty: 'totalProperty',
root: 'root'
}, [
{name: 'id'},
{name: 'sex'},
{name: 'name'},
{name: 'descn'}
])
});
function renderSex(value) {
if (value == 'male') {
return "<span style='color:red;font-weight:bold;'>男</span>";
} else {
return "<span style='color:green;font-weight:bold;'>女</span>";
}
}
function renderDescn(value, cellmeta, record, rowIndex, columnIndex, store) {
var str = "<input type='button' value='詳細信息' onclick='alert(\"" +
"這個單元格的值是：" + value + "\\n" +
"這個單元格的配置是：{cellId:" + cellmeta.cellId + ",id:" + cellmeta.id + ",css:" + cellmeta.css + "}\\n" +
"這個單元格對應行的record是：" + record.data["id"] + "，一行的數據都在里邊\\n" +
"這是第" + rowIndex + "行\\n" +
"這是第" + columnIndex + "列\\n" +
"這個表格對應的Ext.data.Store在這里：" + store + "，隨便用吧。" +
"\")'>";
return str;
}
var grid = new Ext.grid.GridPanel({
el: 'grid',
ds: ds,
cm: cm,
sm: sm,
bbar: new Ext.PagingToolbar({
pageSize: 10,
store: ds,
displayInfo: true,
displayMsg: '顯示第 {0} 條到 {1} 條記錄，一共 {2} 條',
emptyMsg: "沒有記錄"
})
});
ds.load({params:{start:0,limit:10}});
grid.render();
要么忙著生存，要么趕著去死！人總是要做點什么的！