日期:2014-05-16 浏览次数:20425 次

经常遇到这样的情况:年份、单位(显示当前登录用户所属单位)等数据都加载完,然后根据这些查询条件,自动加载数据显示在下面的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();