日期:2014-05-16 浏览次数:20337 次
经常遇到这样的情况:年份、单位(显示当前登录用户所属单位)等数据都加载完,然后根据这些查询条件,自动加载数据显示在下面的grid中;由于Extjs是异步请求,往往年份、单位还没有加载完就去请求数据去了,这种情况不是我们想要的。
?
本人的做法就是年份、单位同步去请求:(如果你有好的方法,请指点!)
?
?
一、js文件的引入
????? 与普通的jsp文件引入没有什么区别
?
<script src="<c:url value="/pms/project/util/SearchToolbar.js"/>" type="text/javascript"></script>
?
?
二、SearchToolbar.js
?
//调用示例 searchItem.prjYear(width,pathUrl) 返回一个ComboBox对象 //参数说明 width为选择框的大小,pathUrl为项目根路径在jsp中${contextPath}获得 var searchItem = { //年度查询条件 prjYear: function(width, showAll){ var url = '/project/manage/common.do?action=years'; if(showAll){ url +="&withall=true"; } var yearComboxStoreData = Synchronize(pathUrl+ url +"&t="+ Math.random());//同步请求 var yearCombox = new Ext.form.ComboBox({ id: 'project-year', width: width, triggerAction: 'all', mode: 'local', displayField: 'name', valueField: 'id', //typeAhead: true, forceSelection: true, selectOnFocus: true, editable: false, store: new Ext.data.Store({ data:yearComboxStoreData, reader: new Ext.data.JsonReader({ idProperty: 'id' }, Ext.data.Record.create(['id', 'name'])) }) }); //设置默认值 Ext.getCmp('project-year').setValue(new Date().getFullYear()); return yearCombox; }, //单位 prjDpt: function(width){ var url = "/project/manage/common.do?action=departments"; var dptsComboxStoreData = Synchronize(contextPath+url +"&t="+ Math.random());//同步请求 var dptsCombox = new Ext.form.ComboBox({ id: 'project-dpts', listWidth: 350, width: width, triggerAction: 'all', mode: 'local', fprceSelection: true, selectOnFocus: true, displayField: 'showName', valueField: 'dptid', editable: false, store: new Ext.data.Store({ data : dptsComboxStoreData, reader : new Ext.data.JsonReader({ idProperty: 'dptid' }, Ext.data.Record.create(['dptid', 'showName'])) }) }); //设置默认值 Ext.getCmp('project-dpts').setValue(dptsCombox.getStore().getAt(0).get('dptid')); return dptsCombox; }, //项目编号 searchBuildProject是jsp页面上的查询方法 prjCode: function(width, searchBuildProject){ var prjCode = new Ext.form.TextField({ id:'prjCode', name:'prjCode', width:width, height:20, listeners : { //回车事件 specialkey : function(field, e) { if (e.getKey() == Ext.EventObject.ENTER) { if(typeof searchBuildProject == 'function'){ searchBuildProject(); } } } } }); return prjCode; }, //翻页工具条 jsp页面中定义的Store pageBar : function(store){ var pageBar = new Ext.PagingToolbar({ pageSize : GlobalParam.limit, store : store, displayInfo : true, displayMsg : '显示第 {0} - {1} 条,共 {2} 条', emptyMsg : '当前没有可以显示的数据 ' }); return pageBar; } };
?
注意:项目编号 searchBuildProject是jsp页面上的查询方法
?
三、Synchronize.js 同步请求
?
Synchronize = function(url) { function createXhrObject() { var http; var activeX = ['MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP', 'Microsoft.XMLHTTP']; try { http = new XMLHttpRequest();