var dataSource = ''; var myStore = ''; Ext.require([ 'Ext.grid.*', 'Ext.data.*' ]); Ext.onReady(function() { Ext.QuickTips.init();// 标准初始化 // 建立一个store要使用的 model Ext.define('flow_analyse', { extend : 'Ext.data.Model', fields : [ { name : 'count_flow', type : 'int' }, { name : 'first_flow', type : 'int' }, { name : 'last_flow', type : 'int' }] }); myStore = Ext.create('Ext.data.Store', { model : 'flow_analyse', reader: { type: 'json', root: dataSource }, autoLoad : false }); var grid = Ext.create('Ext.grid.Panel', { renderTo : 'information_date',// 渲染到一个div上 frame : true,// 面板渲染 forceFit : true,// 自动填充panel空白处 autoHeight:true, columns : [// 列模式 { text:'序号', xtype: 'rownumberer', width:50, align : 'center'}, { text : "总流量", dataIndex : 'count_flow', width : 100, align : 'center' }, { text : "上行流量", dataIndex : 'first_flow', width : 100, align : 'center' }, { text : "下行流量", dataIndex : 'last_flow', width : 200, align : 'center' }], store : myStore, dockedItems : [ {// 分页 xtype : 'pagingtoolbar', store : myStore, dock : 'bottom',// 定位 displayInfo : true } ] }); /** * 以下是非EXT代码,Ext.onReady(function(){})与$(function(){})具有同样的功能 */ onclickMenu(); //初始化条件区的时间 $('#startDate').datetimebox({ showSeconds:true }); $('#endDate').datetimebox({ showSeconds:true }) });
以下为ajax代码:
function onclickMenu(){ var datas = { }; $.ajax({ type:'post', url:path+'/multipleAnalyseController/selectFlowAnalyse.do', dataType:'json', async: false, data: datas, success:function(result){ myStore.removeAll(); dataSource = result.multipleAnalyseList; myStore.add(dataSource); } }); }