<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript" src="../examples.js"></script>
</head>
<body>
<script>
Ext.onReady(function(){
//定义数据二维数组
var data=[
['EasyJWeb', 'EasyJF','www.easyjf.com'],
['jfox', 'huihoo','www.huihoo.org'],
['jdon', 'jdon','www.jdon.com'],
['springside', 'springside','www.springside.org.cn']
];
//自定义列
function check(value)
{
if (value=='列1内容2')
{
return '<span style="color:red;font-weight:bold;">自定义列</span>';
}
else
{
return value;
}
}
//整理数据定义3列的索引为con1,con2,con3
var store=new Ext.data.SimpleStore({
data:data,fields:['name','organization','homepage']
});
//定义勾选框,不需要可不必定义
var sm = new Ext.grid.CheckboxSelectionModel();
//定义列
var colM=new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(),//增加自动编号,不需要可不必定义
sm,//勾选框,不需要可不必定义
{header:'项目名称',dataIndex:'name',width:170,sortable:true,renderer:check},// 生成列,sortable为列排序,不需要设置为false,默认false,renderer为该列增加自定义函数
{header:'开发团队',dataIndex:'organization',width:170,sortable:true},
{header:'网址',dataIndex:'homepage',width:170}
]);
//生成表格
var grid = new Ext.grid.GridPanel({
renderTo:'show',
title:"我的表格",
height:200,
width:600,
cm:colM,
sm:sm,
store:store
});
});
</script>
<div id="show"></div>
</body>
</html>
这是我本人,用extjs2.0做的第一个表格,呵呵!!