JSP引入含有ExtJs定义的组件的js文件并同步请求

经常遇到这样的情况：年份、单位(显示当前登录用户所属单位)等数据都加载完，然后根据这些查询条件，自动加载数据显示在下面的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();       } catch (e) {           for (var i = 0; i < activeX.length; ++i) {               try {                   http = new ActiveXObject(activeX[i]);                   break;               } catch (e) {}           }    } finally {           return http;      }   };   var conn = createXhrObject();   conn.open("GET", url, false);   conn.send(null);   if (conn.responseText != '') {return Ext.decode(conn.responseText);       } else {           return null;       }   };

?