日期:2014-05-16  浏览次数:20355 次

extjs学习笔记(三)最基本的grid

extjs的一个亮点就是提供了丰富的UI,使得没有艺术细胞的程序员也能做出绚丽的界面。把所有的UI集中到一起,有好处也有坏处,好处是有了统一的风格和接口,坏处是js文件过于庞大,使用extjs的最小集合也超过了500k,所以在有些项目中并不适用。jquery在这方面则正好相反,它的 UI都以插件形式提供,可以需要什么就引用什么,所以非常小巧灵活,但由于插件往往是由不同的人或者团队来提供,界面和接口往往就不那么一致。反正是各有千秋吧。
??? 今天学习extjs中的grid,它可以说是功能强大,无出其右,只有你想不到的,没有它做不到的,呵呵,好像是有点夸张了。好,不说废话了,我们就从最简单的grid开始,一步步来看看extjs给我们提供的grid究竟给我们提供了哪些功能。
??? 一个grid包括一些行和列,在extjs里边,列由Ext.grid.ColumnModel来管理,我们来看看如何创建一个ColumnModel对象:

1{id:'company',header:?"Company",?width:?160,?sortable:?true,?dataIndex:?'company'},
3{header:?"Price",?width:?75,?sortable:?true,? dataIndex:?'price'},
4{header:?"Change",?width:?75,?sortable:?true,? dataIndex:?'change'},
5{header:?"%?Change",?width:?75,?sortable:?true,? dataIndex:?'pctChange'},
6