ExtJs学习资料22-从服务器获取JSON数据并分页处理.doc

1、引入ExtJs框架文件（存入Global.js文件中） document.write(link rel=\stylesheet\ type=\text/css\ href=\../extjs/resources/css/ext-all.css\/ ); document.write(script type=\text/javascript\ src=\../extjs/adapter/ext/ext-base.js\/script); document.write(script type=\text/javascript\ src=\../extjs/ext-all.js\/script); document.write(script type=\text/javascript\ src=\../extjs/ext-lang-zh_CN.js\/script); 2、引入Global.js文件 script type=text/javascript src=Global.js/script 3、效果图 ===================================================================================================================== 4、JS源代码 script type=text/javascript Ext.onReady(function(){ //--开始-- Ext.QuickTips.init(); //================将数值转为货币形式====================== function float_money(cellValue){ return (Ext.util.Format.usMoney(cellValue)); } //====================================================== var remoteData=new Ext.data.Store({ /*proxy:new Ext.data.HttpProxy({ url:jsonDataInfo.asp, method:POST }), //或者是*/ url:jsonDataInfo.asp, reader:new Ext.data.JsonReader({ // id一个数据行对象的属性名，它包含数据行的id值 id:id, // totalProperty属性名，从其中可以获得数据集记录的总大小。 //当整个数据集不是一次性返回，而是在服务器端做好分页时，才需要此参数 totalProperty:total, // successProperty属性名，从其中可以获得供表单使用的success参数 successProperty:success, // root属性名，它包含数据行数组 root:rows }, Ext.data.Record.create([ id, title, director, {name:released,type:date,dateFormat:Y-m-d}, genre, tagline, {name:price,type:float}, {name:active,type:bool} ]) ), autoLoad:true }); //remoteData.load(); //等效于在配置项中autoLoad:true /*remoteData.on(load,function(_store,_records){ //在加载完新的记录集时触发 alert(数据存储器含有记录数:+_store.getCount()+，记录集:+_records.length); });*/ var _grid=new Ext.grid.GridPanel({ title:从服务器读取JSON数据并分页显示, width:500, height:166, renderTo:Ext.getBody(), viewConfig:{ atutoFill:true, forceFit:true }, loadMask:{ //载入服务器端数据提示信息 msg:正在载入数据,请耐心等待..., // removeMask:设置为true将创建一个一次性的遮罩,在加载完成之后被自动销毁(对于页面加载非常有用) //设置为false