Ext.onReady(function(){ window.path = '<%=request.getContextPath()%>'; Ext.QuickTips.init(); Ext.BLANK_IMAGE_URL = path+'/jslib/ext2.2/resources/images/default/s.gif'; init(); }); function getWidth(){ return document.body.clientWidth; } function getHeight(){ return document.body.clientHeight; } function init(){ new Ext.form.FieldSet({ title:'查询区域', height: 'auto', contentEl:'query-form', collapsible:true, renderTo:'query-area', buttons:[ { xtype:'button', text:'查询' }, { xtype:'button', text:'重置', handler:function(){ document.getElementById('query-form').reset(); } } ] }); var fields = [ {name:'a'},{name:'b'},{name:'c'},{name:'d'} ]; var datas = []; for(var i=0; i<100; i++){ datas.push({a:'name151-'+(i+1),b:'area',c:2009,d:'description}); } var proxy = new Ext.data.MemoryProxy({totalProperty:datas.length,root:[]}); var store = new Ext.data.Store({ remoteSort:false, reader:new Ext.data.JsonReader({ totalProperty: 'totalProperty', root: 'root' },fields), proxy: proxy }); store.on('beforeload', function(s, params){ var start = params.params.start; var end = start + params.params.limit; //alert(start+", "+end +" Data's Size:"+datas.length); proxy.data = {totalProperty:datas.length,root:datas.slice(start, end)}; }); var fw = getWidth()-15; var gw = getWidth()-20; var fh = Math.round(getHeight()*0.6); new Ext.grid.GridPanel({ title:'显示区域', width:fw, height:fh-20, collapsible:true, renderTo:'show-area', bbar: new Ext.PagingToolbar({ store:store, pageSize:15 }), store: store, columns:[ new Ext.grid.RowNumberer(), {header:'A', align:'center', width:Math.round(gw*0.3), dataIndex:'a', sortable:true}, {header:'B', align:'center', width:Math.round(gw*0.2), dataIndex:'b', sortable:true}, {header:'C, align:'center', width:Math.round(gw*0.2), dataIndex:'c', sortable:true}, {header:'D, align:'center', width:Math.round(gw*0.3), dataIndex:'d', sortable:true} ], viewConfig: { forceFit: true }, sm: new Ext.grid.RowSelectionModel({singleSelect:true}) }); store.load({params:{start:0,limit:15}}); }