extjs combobox分页查询

来源:岁月联盟 编辑:exp 时间:2012-04-18

IE6.0++

extjs3.3.1

以下就是代码:

[javascript]
/**
 * YHC
 */ 
 
/**
 * 分页的Combobox
 */ 
PagingMedicalcareCbo=Ext.extend(Ext.form.ComboBox,{ 
    /**
     * 构造方法
     */ 
    timedelay_Slow:2000,//1000ms=1s  
    timedelay_fast:1000,//1000ms=1s  
    t:null, 
    myStore:null, 
    currentCboText:null,//当前CBO文本框中的值  
    constructor:function(){ 
        this.myStore=new Ext.data.JsonStore({ 
            url:"/his/medical_care!ajaxMedicalcareCbo.action",//url地址  
            root: 'root', 
            idProperty: 'linkId', 
            totalProperty:"totalProperty",  
            fields:[{name:"linkId"}, 
                    {name:"orgCode"}, 
                    {name:"orgName"}, 
                    {name:"dbName"}, 
                    {name:"serverType"}], 
            listeners :{ 
                beforeload:this.onCboBeforeLoad, 
                scope:this 
            } 
        }); 
         
 
        //  
        PagingMedicalcareCbo.superclass.constructor.call(this,{ 
            id:"searchCbo", 
            store:this.myStore, 
            mode:"remote", 
            pageSize:5, 
            triggerAction:"all", 
            displayField:"orgName", 
            //valueField:"linkId",  
            width:180, 
            listWidth:220, 
            fieldLabel:'医疗单位', 
            listeners :{ 
                select:this.onSelected, 
                keyup:this.onKeyup, 
                scope:this 
                } 
        }); 
         
    }, 
    //设置参数  
    onCboBeforeLoad:function(store,options){ 
        if(this.currentCboText!=null&&(typeof this.currentCboText)!='undefined'){ 
            //带机构名称  
            store.baseParams={'medicalCareVo.orgName':this.currentCboText};  
        }else{ 
            //没有任何的参数  
            store.baseParams={}; 
        } 
         
    }, 
    //选择之后,对应赋值  
    onSelected:function(combo,record,index){ 
        var orgName=this.myStore.getAt(index).get('orgName'); 
        //this.value=orgName;  
        alert(this.myStore.getAt(index).get('orgName')); 
    }, 
    //键盘弹起的时候 ,赋值当前文本值  
    onKeyup:function(combo,e){ 
        this.currentCboText=Ext.getCmp('searchCbo').getValue(); 
        //切记 清除(很重要) 下一次需要清除上一次  
        if(this.t){ 
            window.clearInterval(this.t);//清除延时执行  
        } 
        //如果此时用户将文本框的值删除完之后(也就是没有任何的值)  
        if(this.currentCboText==''){ 
        this.t=window.setInterval('Ext.getCmp("searchCbo").myStoreLoadData()', this.timedelay_fast); 
        return; 
        } 
        //延时执行,避免用户输入太快,导致访问服务器次数增加,节约性能  
        this.t=window.setInterval('Ext.getCmp("searchCbo").myStoreLoadData()', this.timedelay_Slow); 
         
    }, 
    //--myStore重新加载数据  
    myStoreLoadData:function(){ 
         
        //重新加载数据  
        this.myStore.load({ 
            params:{start:0,limit:5} 
        }); 
        //切记 清除(很重要)  
        if(this.t!=null){ 
            window.clearInterval(this.t);//清除延时执行  
        } 
    } 
}); 
/**
 * YHC
 */

/**
 * 分页的Combobox
 */
PagingMedicalcareCbo=Ext.extend(Ext.form.ComboBox,{
 /**
  * 构造方法
  */
 timedelay_Slow:2000,//1000ms=1s
 timedelay_fast:1000,//1000ms=1s
 t:null,
 myStore:null,
 currentCboText:null,//当前CBO文本框中的值
 constructor:function(){
  this.myStore=new Ext.data.JsonStore({
   url:"/his/medical_care!ajaxMedicalcareCbo.action",//url地址
   root: 'root',
   idProperty: 'linkId',
   totalProperty:"totalProperty",
   fields:[{name:"linkId"},
     {name:"orgCode"},
        {name:"orgName"},
     {name:"dbName"},
     {name:"serverType"}],
   listeners :{
    beforeload:this.onCboBeforeLoad,
    scope:this
   }
  });
  

  //
  PagingMedicalcareCbo.superclass.constructor.call(this,{
   id:"searchCbo",
   store:this.myStore,
   mode:"remote",
   pageSize:5,
   triggerAction:"all",
   displayField:"orgName",
   //valueField:"linkId",
   width:180,
   listWidth:220,
   fieldLabel:'医疗单位',
   listeners :{
    select:this.onSelected,
    keyup:this.onKeyup,
    scope:this
    }
  });
  
 },
 //设置参数
 onCboBeforeLoad:function(store,options){
  if(this.currentCboText!=null&&(typeof this.currentCboText)!='undefined'){
   //带机构名称
   store.baseParams={'medicalCareVo.orgName':this.currentCboText}; 
  }else{
   //没有任何的参数
   store.baseParams={};
  }
  
 },
 //选择之后,对应赋值
 onSelected:function(combo,record,index){
  var orgName=this.myStore.getAt(index).get('orgName');
  //this.value=orgName;
  alert(this.myStore.getAt(index).get('orgName'));
 },
 //键盘弹起的时候 ,赋值当前文本值
 onKeyup:function(combo,e){
  this.currentCboText=Ext.getCmp('searchCbo').getValue();
  //切记 清除(很重要) 下一次需要清除上一次
  if(this.t){
   window.clearInterval(this.t);//清除延时执行
  }
  //如果此时用户将文本框的值删除完之后(也就是没有任何的值)
        if(this.currentCboText==''){
        this.t=window.setInterval('Ext.getCmp("searchCbo").myStoreLoadData()', this.timedelay_fast);
        return;
        }
  //延时执行,避免用户输入太快,导致访问服务器次数增加,节约性能
  this.t=window.setInterval('Ext.getCmp("searchCbo").myStoreLoadData()', this.timedelay_Slow);
  
 },
 //--myStore重新加载数据
 myStoreLoadData:function(){
  
  //重新加载数据
        this.myStore.load({
         params:{start:0,limit:5}
     });
        //切记 清除(很重要)
  if(this.t!=null){
   window.clearInterval(this.t);//清除延时执行
  }
 }
});


在调用延时的时候需要使用字符串调用:

[javascript] this.t=window.setInterval('Ext.getCmp("searchCbo").myStoreLoadData()', this.timedelay_Slow); 
this.t=window.setInterval('Ext.getCmp("searchCbo").myStoreLoadData()', this.timedelay_Slow);还有切记使用Ext的方法,不能使用this.方法名(错误),正确的是我上面写的方式.


在调用的时候需要使用字符串,才能延时调用,否则不可以,切记切记....


 摘自 yhc13429826359的专栏