extjs gridpanel使用方法

<!--Title:GridPanel 使用方案简单教程Author:Lovingshu(Mr Samael)Date:2012/07/27Remark:Use simple way to work with EXTJS-->Extjs中功能强大的组件太多了~GridPanel就是其中一个,写一个简单的教程实现GridPanel数据的加载...CODES://这个是必须的~不然~你F5按坏了它都不会鸟你Ext.onReady(function(){//得到ColumnModel对象,设定里面需要初始化的列及相关属性(*特别注意:是ColumnModel([])而不是ColumnModel(),中间记得加中括号!丫的~忘记了就等着把F5按坏吧)var colModel=new Ext.grid.ColumnModel([new Ext.grid.RowNumberer({header:"ID",width:20}),{header:"User Name",dataIndex:"USERNAME",sortable:true},//renderer这个方法我靠~~了不得~今天要不是看到韦少演示~哟西~我还不知道有这个方法~用了的人都说好{header:"User Pwd",dataIndex:"USERPWD",renderer:"function(value){value='';return '******';}"},{header:"User Remark",dataIndex:"USERREMARK"}]);//列的对象有了接下来就是的到数据了~Store是Extjs中不可缺少的组件,很强悍的对象,具体的可以参考帮助文档,在这里谢谢脚本娃娃整理的帮助文档~var store=new Ext.data.Store({url:"XXXX",//对应数据加载的路径,会通过ajax方式进行访问reader:new Ext.data.JsonReader({root:"",//JSON中对应的节点位置fields:["USERID","USERNAME","USERPWD","USERREMARK"]//JSON格式中对应的key}),autoLoad:true//是否需要自动加载数据~默认为false});//如果需要分页的话您还需要创建分页对象Pagingbar,记住是Ext.PagingToolbar,其中还有很多属性,具体参考帮助文档var pBar=new Ext.PagingToolbar({store:store});//最重要的来了~~~GridPanel~主角登场了~gridPanel就是把前面我们的东西全部整合的容器var gridPanle=new Ext.grid.GridPanel({title:"标题",cm:colModel,store:store,bbar:pBar,autoWidth:true,autoHeight:true,renderTo:""//需要放入该组件的容器的ID});});CODES FINISH~写完了~希望有帮助...<!--Author:Lovingshu's ForeverRemark:Guys~You're the best!-->