WebService结合ExtJS创建资料列表查询器(3)

varURL=remote_serverUrl+"searchFilesInfo?

folderName="+folderNameTxt+"&fileName="+fileName;

xmlhttp.Open("GET",URL,false);

xmlhttp.SetRequestHeader("Content-Type","text/

xml;charset=utf-8");

xmlhttp.onreadystatechange=function(){if(xmlhttp.readyState==4){

if(xmlhttp.status==200){

docSubmit=newActiveXObject("Microsoft.XMLDOM");

docSubmit.async=false;

docSubmit.loadXML(xmlhttp.responseText.replace(/&lt;/g,"<").replace(/&gt;/g,">"));

varpois=docSubmit.documentElement.

getElementsByTagName("poi");

varqResult=pois[0].getAttribute("value");varjsList=newArray();if(qResult.length>0){

varvals=qResult.split("@");fpath=vals[0];

for(vari=1,n=vals.length;i<n;i++){jsList.push(vals[i]);}}

ToExtGrid(jsList,folderNameTxt,fileName);

}}};

xmlhttp.Send(null);xmlhttp=null;函数ListPlanInfo中变量serverUrl值为WebService的URL地址，可根据实际地址配置。ToExtGrid功能函数是将XML生成JSON文本，转换成数据记录集创建Ext对象。

4资料列表查询器

在ToExtGrid函数中，创建了Ext.Windowc对象的查询器

主界面。主界面布局如下：左栏为FormPanel对象，左栏上侧嵌入TextField和Button对象的FormPanel对象用来，左侧下侧为GridPane对象用来显示结果，布局右栏为Ext.Panel对象，用户单击或双击文件名即可将文件内容显示在右栏中。程序中使用JavaScrip:eval()函数将JSON字符串转换为Array数组类型，作为创建Ext.data.SimpleStore对象的输入参数。

具体代码实现如下

{

varjsonstr="[";

for(vari=0;i<jsList.length;i++){

vartempObject=[i,jsList[i].split(",")[0]];

jsonstr=jsonstr+"["+parseInt(i+1)+",'"+jsList[i].split

(",")[0]+"','"+jsList[i].split(",")[1].replace(/\\/g,"\\\\")+"']";

if(i!=jsList.length-1){jsonstr+=",";}}

jsonstr+="]";

vardata=eval(jsonstr);

varstore=newExt.data.SimpleStore({data:data,fields:["id","name","path"]});

varcolM=newExt.grid.ColumnModel([{header:"序号",dataIndex:"id",sortable:true,resizable:true},

{header:"文件名称",dataIndex:"name",sortable:false,

resizable:true},

{header:"path",dataIndex:"path",sortable:false,hidden:

true}]);

vargrid=Ext.getCmp("listInfoGrid");if(grid==null){

vartabs=newExt.TabPanel({id:'rightTabs',region:'center',margins:'3330',activeTab:0,

defaults:{autoScroll:true},width:'70%',items:[{

title:'请选择文件',html:''}]});

varrform=newExt.form.FormPanel({id:'rform',header:false,frame:true,

hideBorders:false,items:[

newExt.form.TextField({fieldLabel:'关键字',

name:'fileNameKeyword',enableKeyEvents:true,listeners:{

keyup:function(textField,e){

if(e.getKey()==13){

varfileName=Ext.get('fileNameKeyword').dom.value;

listPlanInfo(folderNameTxt,fileName);

}}

}}),

newExt.Panel({

54

2010.

21